TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Word-like HTML inline edit with design mode

19 pointsby knlam8 months ago

4 comments

treflop8 months ago
This (and the contenteditable attribute) were added in Internet Explorer 5.5 to let you create WYSIWYG editors and it was later reverse engineered and replicated in other browsers.<p>It is still the basis for a lot of WYSIWYG editors, but it&#x27;s not perfect and sometimes provides too little control (produces messy HTML), so sometimes people avoid it and build a WYSIWYG editor from scratch using something like &lt;canvas&gt; (e.g. Google Docs) but this is way more effort.<p>Some of the O.G. WYSIWYG editors (e.g. CKEditor) still use &quot;contenteditable&quot; but patch over all the problems with it.
评论 #41834489 未加载
matthberg8 months ago
MDN says `document.designMode = &quot;on&quot;` is supported in all browsers, not just chrome dev tools. Looks like it&#x27;s a rather ancient feature—in Firefox since 1.0, same with Chrome.<p><a href="https:&#x2F;&#x2F;developer.mozilla.org&#x2F;en-US&#x2F;docs&#x2F;Web&#x2F;API&#x2F;Document&#x2F;designMode" rel="nofollow">https:&#x2F;&#x2F;developer.mozilla.org&#x2F;en-US&#x2F;docs&#x2F;Web&#x2F;API&#x2F;Document&#x2F;de...</a>
tgv8 months ago
Why add &#x27;designMode&#x27;? AFAIK, setting &#x27;contenteditable&#x27; suffices, and you can use it with more precision.
bkyan8 months ago
How do you save your changes with this?
评论 #41834606 未加载