Geek Answers Handbook

HTML inside contenteditable div

I have a contentEditable div within which I must allow the user to edit the HTML.

Do I need to sanitize the HTML that the user writes inside this div?

I mean, when I extract HTML from this div, it is already being sanitized. For example, if I wrote something like <> inside a div and then restored it, I would get &lt;&gt; .

Test it here: http://jsfiddle.net/mByWT/

My other question is: is this standard behavior and can I rely on it in all browsers?

EDIT

Now I can conclude that this is a common template:

  • element.innerHTML returns HTML escape code - it skips < , > amd & , but not quotes
  • element.innerText and element.textContent returns an HTML literal without escaping

See this: http://jsfiddle.net/2CmjG/

+4
source share
2 answers

I think that you yourself answered :). The fact that innerHTML content suitable for div content encodes HTML is a common template. Otherwise, entering the text < or > or &nbsp; or other special HTML objects will break this editor.

Nevertheless, I am sure that there are extreme cases for which browsers will create different results and data created, for example. IE will not be valid on Fx. But I have never seen anything critical. You will also not be able to encode the data specified by innerHTML , because that would be very difficult.

+2
source

jQuery is created to be compatible with all browsers, if you used your code in all browsers, it will work the same way.

However, you want to clear your HTML, because characters like < and > can confuse javascript. You want to further clear HTML if it goes to a database or something like that.

+1
source

More articles:


All Articles