contenteditable 属性
任何元素使用 contenteditable 属性的话，代表该元素是一个可编辑的区域。用户可以改变元素的内容以及操作标记。例如：
<p contenteditable="true">这是一段可编辑的段落。请试着编辑该文本。</p>
该属于有 3 种值可选：true, false 和空字符，空字符代表 true。
而对 <iframe id="editor"></iframe> 框架页面可以通过 JS 程序代码来实现：editor.document.designMode="on" 。
contextmenu 属性
contextmenu 属性用来指向一个作者提供的上下文目录，例如：
<form >
<label>Character name: <input type=text contextmenu=namemenu required></label>
<menu type=context id=namemenu>
<command label="Pick random name" onclick="document.forms.npc.elements.char.value = getRandomName()">
<command label="Prefill other fields based on name" onclick="prefillFields(document.forms.npc.elements.char.value)">
</menu>
</form>
data-* 属性
开发人员可以在任何元素上定义他们想要的任何属性，只要他们在其之前加上 data- 的前缀，以此避免与未来的 HTML 版本的冲突，asp.net MVC 下的 jQuery 验证就是采用这种方式，例如：data-val=”true”。
draggable 和 dropzone 属性
draggable 和 dropzone 属性可以与新的拖放 API 一起使用，draggable 为是否允许拖放，dropzone 代表可以拖放到哪个区域。
<p draggable="true" dropzone="div1">test</p>
hidden 属性
不显示定义了 hidden 属性的元素。但与表现层的比如 tab 切换隐藏图层不同，hidden 后的元素针对所有的显示，比如屏幕阅读器。与 form 里的 hidden 域相似。
role 和 aria-* 属性
HTML5 把 WAI-ARIA 当作是合法的语言增加，用来做辅助作用。
spellcheck 属性
spellcheck 属性规定是否对元素内容进行拼写检查。例如：
<p contenteditable="true" spellcheck="true">这是可编辑的段落。请试着编辑文本。</p>
原文地址 https://www.cnblogs.com/TomXu/archive/2011/12/14/2269137.html