contenteditable属性
contenteditable属性允许将任何HTML元素设置为可编辑。它可包含3个值:true、false和inherit。
[contenteditable]:hover, [contenteditable]:focus {
outline: 2px dotted red;
}
<p contenteditable="true">Your content</p>
contextmenu属性
contextmenu属性提供了元素的上下文菜单。该值必须是DOM中的一个菜单元素的ID。
菜单元素本身只是一组命令。它们可能为表单元素、列表项或其他元素。菜单是隐藏的,直到键击或鼠标单击等事件的触发导致它提供选项和动作的气泡式菜单。
这使您能够像下拉菜单一样节省UI空间,因为它仅在以某种方式请求时才显示。目前现代浏览器中还不支持,但它已为第一次实现做好了准备。代码可能类似于:
<label for="char">Charter name: </label>
<input name="char" type="text" contextmenu="boatmenu" required>
<menu type="context" id="boatmenu">
<!—menu content elements here -->
</menu>
data-*属性
“自定义数据属性是一个没有命名空间的属性,它的名称以字符串“data-”开头,在连字符后拥有至少1个字符……”