HTML5之全局属性 (声明:内容节选自《HTML 5从入门到精通》)
contentEditable
————————————————————————————————————————————————————————
功能:允许用户编辑元素中的内容。
功能说明:
该元素必须是可以获得鼠标焦点的元素,而且在点击鼠标后要向用户提供一个插入符号,提示用户该元素中的内容允许编辑。
注意: contentEditable是一个布尔类型属性,因此可以将其设置为true或false。
说明:该属性还有个隐藏的inherir(继承)状态,属性为true时,元素被指定位允许编辑;属性为false时,元素被指定为不允许编辑;未指定true或false时,则由inherir状态来决定,如果元素的父元素是可编辑的,则该元素就是可编辑的。另外,除了contentEditable属性外,元素还具有一个iscontentEditable属性,当元素可编辑时,该属性为true;当元素不可编辑时,该属性为false。
designMode
————————————————————————————————————————————————————————
功能:用来指定整个页面是否可编辑,当页面可编辑时,页面中任何支持上文所述的contentEditable属性的元素都变成了可编辑
状态。
注意:designMode属性只能在JavaScript脚本里被编辑修改。designMode属性的两个值:该属性有两个值——“on”与
“off”。当属性被指定为“on”时,页面可编辑;被指定为“off”时,页面不可编辑。
使用JavaScript脚本来指定designMode属性的方法如下所示:document.designMode=”on”。
hidden
————————————————————————————————————————————————————————
适用范围:在HTML5中,所有的元素都允许有一个hidden
作用:hidden属性类似于aria-hidden,它告诉浏览器这个元素的内容不应该以任何方式显示。但是元素中的内容还是浏览器创建的
,也就是说页面装载后允许使用JavaScript脚本将该属性取消,取消后该元素变为可见状态,同时元素中的内容也即时显示出来。
类型:Hidden属性是一个布尔值的属性,当设为true时,元素处于不可见状态;当设为false时,元素处于可见状态。
spellcheck
————————————————————————————————————————————————————————
适用范围:spellcheck属性 是HTML5针对input元素(type=text)与textarea这两个文本输入框提供的一个新属性
功能:为对用户输入的文本内容进行拼写和语法检查。
类型:Spellcheck属性是布尔型 ,具体true和false两种值,但是它在书写时有一个特殊的地方,就是必须明确声明属性值为
true或false,书写方法如下所示:
1
2
3
4
5
6
7
8
9
|
<!--以下两种书写方法正确--> < textarea spellcheck="true"> < input type=text spellcheck=false /> <!--以下书写方法为错误--> < textarea spellcheck > |
注意:如果元素的readOnly属性或disabled属性设为true,则不执行拼写检查。
tabindex
————————————————————————————————————————————————————————
Tabindex是开发中的一个基本概念,当不断敲击Tab键让窗口或页面中的控件获得焦点,对窗口或页面中的所有控件进行遍历的时候,每一个控件的tabindex 表示该控件是第几个被访问到的。
tabindex属性还有另外一个作用。在默认情况下,只有链接、表单元素和图像映射区域可以通过键盘获得焦点。如果对其他元素使用tabindex属性后,也能让改元素获得焦点,那么当脚本中执行focus()语句的时候,就可以让该元素获得焦点了。但是这样做会产生一个副作用:该元素也可以通过Tab键获得焦点,而这又时可能不是开发者想要的结果。把元素的tabindex值设为负数(通常为-1)后就解决这个问题了。Tabindex的值为负数后,仍然可以通过编程的方式让元素获得焦点,但按下Tab键时该元素就不能获得焦点了,这在复杂的页面中或复杂的Web应用程序中时十分有用的。在HTML4中,-1是一个无用的属性值,但到了HTML5中,通过巧妙地运用让改属性值得到了极大地应用。
HTML5之全局属性 (声明:内容节选自《HTML 5从入门到精通》)的更多相关文章
- 自学HTML5第一天(认识HTML5的全局属性)
contextmenu 属性 规定 <div> 元素的上下文菜单.上下文菜单会在用户右键点击元素时出现.列子: <div contextmenu="mymenu" ...
- HTML5的全局属性
contentEditable:是否允许用户编辑元素中的内容.contentEditable有两个值,一个True 一个False. 例子: <ul contentEditable=" ...
- html5新增全局属性
data-* 如:data-type,data-role等 hidden <div hidden></div> 隐藏该div spellcheck <textarea ...
- HTML5全局属性和事件详解
属性: HTML5属性能够赋给标签元素含义和语境,下面的全局属性可用于任何 HTML5 元素. 属性 描述 contenteditable 规定是否允许用户编辑内容. contextmenu 规定元素 ...
- html5全局属性
全局属性:对于任何一个标签都是可以使用的属性. 一.data-* 在html5之前需要在html标签上添加自定义属性来存储和操作数据,可能是会写<form role="xxx" ...
- HTML5全局属性和事件
全局属性和事件能够应用到所有标签元素上,在HTML4中有许多全局属性,比如id,class等.HTML5中又新增了一些特殊功能的全局属性和事件. 属性: HTML5属性能够赋给标签元素含义和语 ...
- html5中的全局属性
在html5中,新增了一个"全局属性"的概念,所谓全局属性,是指可以对任何属性都使用的属性.下面列出常用的全局属性. 1.contentEditable属性,是微软开发的,该属性主 ...
- html5 转义实体字符 元数据 跳转 全局属性 id class lang style
实体 Html 实体就是把特殊字符通过代码显示出来, 比如, <>在浏览器会识别为标签,不能正常显示, 这是你就需要安如<去表达左尖括号. 元数据 2. 声明字符编码 3.模 ...
- HTML5中新增加的结构元素、网页元素和全局属性
HTML5新增的结构元素(新增的都是块元素,独占一行) 1) header 定义了文档的头部区域 <header> <h1>网站标题<h1> </header ...
随机推荐
- nodejs之模块加载机制
nodejs模块加载原理 node加载模块步骤: 1) 路径分析 (如判断是不是核心模块.是绝对路径还是相对路径等) 2) 文件定位 (文件扩展名分析, 目录和包处理等细节) 3) 编译执行 原生模块 ...
- 查看服务器CPU的个数、CPU的核数、多核超线程数、机器硬件型号
这里有几个概念: 1.一台物理机的物理CPU的个数 2.一个CPU上的核数 3.一个核上面支持的线程数 有下面的计算公式: # 总核数 = 物理CPU个数 X 每颗物理CPU的核数 # 总逻辑CPU数 ...
- byte范围及8种常见数据类型
byte范围:-128 到 127 原因 : 在计算机内,定点数有3种表示法:原码.反码和补码 原码 :二进制定点表示法,即最高位为符号位,“0”表示正,“1”表示负,其余位表示数值的大小. 反码 ...
- 关于Ubuntu的默认python版本
大部分Ubuntu系统默认python版本都是python2.x系列,但最新版本已经是3.5和3.6了,软件系统跟着版本走总是有诸多好处的,所以,以下是作者在修改Ubantu默认python版本时的一 ...
- 【bzoj2789】 Letters 树状数组
又是一道树状数组求逆序对的题目. 这一题我们可以将第二个串中的每一个字母,与第一个串中的字母做两两匹配,令第二个串第i个字母的值id[i]为该字母与第一个串中的字母匹配到的位置. 然后考虑到所求答案为 ...
- An assembly specified in the application dependencies manifest
.Net Core 运行的时候报错 An assembly specified in the application dependencies manifest (xxx.deps.json) was ...
- LINUX 下 NMAP 内网扫描
#1.扫描内网存活主机 nmap -sP 10.2.24.* |grep for > tmp #2.扫描主机端口 nmap -A -T4 192.168.1.2 #3.扫描主机的所有端口 nma ...
- Java基础知识01
1. String,StringBuffer和StringBuilder的区别? String:final修饰,String对象创建后不可修改:StringBuffer和StringBuilder对象 ...
- sql 递归树
with CTE as ( -->Begin 一个定位点成员 select ID, PersonName,ParentID,cast(PersonName as nvarchar(max)) a ...
- 【Express系列】第3篇——接入mysql
通常来说,前后端分离的项目,前端负责界面渲染和操作型的业务逻辑,后端则负责数据存取和数据处理相关的业务逻辑. 既然设计数据,那就少不了数据库的使用.目前市面上流行着各种各样的数据库,这里不打算一一列举 ...