HTML5学习笔记简明版（8）：新增的全局属性

待我称王封你为后i 2022-04-16 04:21 160阅读 0赞

# contenteditable属性 #

任何元素使用contenteditable属性的话，代表该元素是一个可编辑的区域。用户可以改变元素的内容以及操作标记。例如：

<p contenteditable="true">这是一段可编辑的段落。请试着编辑该文本。</p>

该属于有3种值可选：true, false和空字符，空字符代表true。

而对<iframe id="editor"></iframe>框架页面可以通过JS程序代码来实现：editor.document.designMode="on" 。

# contextmenu属性 #

contextmenu属性用来指向一个作者提供的上下文目录，例如：

<form name="npc" action="">
     <label>Character name: <input type=text contextmenu=namemenu  required></label>
     <menu type=context id=namemenu>
      <command label="Pick random name" οnclick="document.forms.npc.elements.char.value = getRandomName()">
      <command label="Prefill other fields based on name" οnclick="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>

发表评论取消回复

表情：

评论列表（有 0 条评论，160人围观）

还没有评论，来说两句吧...

相关阅读

相关 HTML5新增属性

-------------------- typora-root-url: ./ HTML5新增元素及属性 1、HTML5阶段内容 HTML5新增元素、属性

青旅半醒/ 2022年09月07日 14:33/ 0 赞/ 202 阅读

相关 HTML5几个有趣的新增全局属性

突然发现几个HTML5新增的属性中有几个有趣的，在这里分享一下。 ▍contentEditable：元素内容是否可编辑 <!DOCTYPE html>

ゝ一世哀愁。/ 2022年05月16日 10:00/ 0 赞/ 180 阅读

相关 HTML5学习笔记简明版（11）：新增的API

HTMLDocument上的扩展 HTML5在DOM Level 2 HTML上扩展了一些HTMLDocument的接口。这些接口在所有实现了Document接口的元素对

忘是亡心i/ 2022年04月16日 04:22/ 0 赞/ 150 阅读

相关 HTML5学习笔记简明版（10）：废弃的元素和属性

废弃的元素（Element）这个小节里列出的元素在HTML5里将不再使用，现有文档升级到 HTML5的话可以使用一些替代方案。例如parser section 可以处理

迈不过友情╰/ 2022年04月16日 04:22/ 0 赞/ 152 阅读

相关 HTML5学习笔记简明版（9）：变化的元素和属性

改变的元素（Element）以下元素在HTML5里的用法稍作修改以便能在web里更好的使用或者起到更大作用： 1. 没有href属性的a元素将显示成一个占位符，而且

今天药忘吃喽~/ 2022年04月16日 04:21/ 0 赞/ 185 阅读

相关 HTML5学习笔记简明版（8）：新增的全局属性

contenteditable属性任何元素使用contenteditable属性的话，代表该元素是一个可编辑的区域。用户可以改变元素的内容以及操作标记。例如：

待我称王封你为后i/ 2022年04月16日 04:21/ 0 赞/ 161 阅读

相关 HTML5学习笔记简明版（7）：新增属性（2）

dirname属性 input 和 textarea 元素有了一个新元素 dirname，用于用户所设置的提交的方向性的控制(译注，即书写的方向性，ltr或rtl)。

╰+攻爆jí腚メ/ 2022年04月16日 04:20/ 0 赞/ 825 阅读

相关 HTML5学习笔记简明版（6）：新增属性（1）

a和area下的media属性为了和link元素保存一致性，a元素和area元素也都增加了media属性，只有在href存在时菜有效。media属性的意思是目标 URL

忘是亡心i/ 2022年04月16日 04:20/ 0 赞/ 198 阅读

相关 HTML5学习笔记简明版（5）：input的type超级类型

HTML5为input的type类型增加了多种枚举值，用来表达不同的意思，同事具有验证功能，如果格式不对，浏览器将原始提供错误提示，堪称超级牛X啊，具体如下： <tab

青旅半醒/ 2022年04月16日 04:19/ 0 赞/ 144 阅读

相关 HTML5学习笔记简明版（1）：HTML5介绍与语法

HTML5介绍 HTML5是继HTML4以后的下一代HTML标准规范，它提供了一些新的元素和属性（例如`<nav>`网站导航块和`<footer>`）。新型的标签有利于搜

Bertha 。/ 2022年04月16日 04:19/ 0 赞/ 210 阅读