标签：
今天一个html-css-js伙伴提出了一个问题：用textarea中写入img标签，导致浏览器直接输出标签本身，而不是伙伴所期望的“在评论区图文自由混排，图片路径已经获取”。
当时的解决问题的措施：google ‘textarea insert img‘,在stackoverflow上找到了‘contenteditable‘-代码实测，实现效果：‘这是h5 新属性，用吧’-OK,问题解决，撤，赶末班车。
至此打住，不是解决问题和发展之道。
google，从
https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Editable_content
http://www.w3schools.com/
https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes#attr-contenteditable
https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/contenteditable
到
https://www.w3.org/TR/html5/editing.html#attr-contenteditable
http://w3c.github.io/html/editing.html#attr-contenteditable
https://www.w3.org/TR/html5/infrastructure.html#enumerated-attribute
https://html.spec.whatwg.org/multipage/
https://html.spec.whatwg.org/multipage/interaction.html#attr-contenteditable
之间有rollback
虽然
---->---->---->
contenteditable content attributeThe contenteditable attribute is an enumerated attribute whose keywords are the empty string, true, and false. The empty string and the true keyword map to the true state. The false keyword maps to the false state. In addition, there is a third state, the inherit state, which is the missing value default (and the invalid value default).
The true state indicates that the element is editable. The inherit state indicates that the element is editable if its parent is. The false state indicates that the element is not editable.
contentEditable [ = value ]Returns "true", "false", or "inherit", based on the state of the contenteditable attribute.
Can be set, to change that state.
Throws a SyntaxError exception if the new value isn‘t one of those strings.
isContentEditableReturns true if the element is editable; otherwise, returns false.
The contentEditable IDL attribute, on getting, must return the string "true" if the content attribute is set to the true state, "false" if the content attribute is set to the false state, and "inherit" otherwise. On setting, if the new value is an ASCII case-insensitive match for the string "inherit" then the content attribute must be removed, if the new value is an ASCII case-insensitive match for the string "true" then the content attribute must be set to the string "true", if the new value is an ASCII case-insensitive match for the string "false" then the content attribute must be set to the string "false", and otherwise the attribute setter must throw a SyntaxError exception.
The isContentEditable IDL attribute, on getting, must return true if the element is either an editing host or editable, and false otherwise.
<---<---<---
到此，在想这些东西，对于最初的问题的解决，还是停留在离开办公室的阶段，仅仅是知道有‘contenteditable‘，也知道‘原始的用法’了，但是，还是‘只见树木的阶段’。
当看了下面这一点时，
‘the user is expected to write the article using HTML‘
https://html.spec.whatwg.org/multipage/interaction.html#attr-contenteditable
才对于原问题有了一层抽象化、‘对象化’的认识，同时领悟到‘contenteditable‘的出现的目的，是实现、取代一些‘编辑器产品’，二者关系即video canvas Tag 标签 之于flash 吧？
小结：
0-
标签：
原文地址：http://www.cnblogs.com/yuanjiangw/p/5767090.html
