HTML5中新增了“全部属性”的概念。所谓全局属性它是指可以对任何元素都可以使用的属性,今天为大家详细介绍三种常见的全局属性。

contentEditable属性

contentEditable是由微软开发。被其他浏览器反编译并投入应用的一个全局属性。它的主要功能是是否允许用户编辑元素的内容,被编辑元素必须是获得鼠标焦点的元素,而且在点击后要提供一个插入符号,提示用户该元素中内容允许编辑。contentEditable属性是一个布尔值属性,可以指定为ture或false。该属性还有一个隐藏属性的inherit状态,为true是允许用户编辑;为false时元素不能被用户编辑;没有指定时则由inherit状态决定,如果父元素是可编辑的,该元素也是可编辑的。支持contentEditable属性元素有A、DD、DIR、DIV、BUTTON、FORM、DL、DT、FONT、DFN、hn、CODE、ABBR等。

designMode属性

designMode属性主要功能是指定整个页面是否可编辑,页面可编辑时,页面中任何支持contentEditable属性的元素都变成了可编辑状态。designMode属性有两个值“on”和"off"。属性为“on”时,页面可编辑;属性为“off”时,页面不可编辑。不过各个浏览器支持情况也不一样,IE8不支持designMode属性,IE9支持designMode属性,fixfox和Opera浏览器支持designMode属性、Chrom和Safari浏览器在内嵌frame支持designMode属性。

hidden属性

在HTML5中所有的元素允许使用hidden属性。它类似input元素中的hidden属性,使元素处于不可见状态。hidden属性设置为ture,元素处于不可见状态;hidden属性设置为false时元素处于可见状态。

spellcheck属性

spellcheck属性主要是针对input元素和textarea这两个文本输入框提供的新属性,它的功能是对输入内容进行拼写和语法检查。它有个特殊的地方,就是必须声明属性值true或者false。如果元素是readonly属性或者disabled属性为true,不执行拼写检查。Firfox、IE、Chrome、Safari等浏览器都支持该属性。

tabindex属性

tabindex在程序开发概念,是指不断敲击Tab键让窗口或页面中控件获得焦点,对窗口的控件进行遍历,每个控件的tabindex表示第几个被访问的。之前这个属性在编辑网页很有用,现在是根据元素所在位置决定遍历顺序,所以就不需要了。不过tabindex拎一个作用,只有链接元素与表单元素可以通过按键获得焦点。如果对元素使用了tabindex属性后,也能让元素获得焦点,执行focus()语句时,可以让元素获得焦点了。但是这样会出现一个问题,元素会通过tab获得焦点,而这时候我们不想让该元素获得焦点这不是我们想要的结果。

把元素的tabindex值设定为负数后就可以解决这个问题了。tabindex为负值时,可以通过编程的方式让元素获得焦点,但按下Tab键该元素就不能获得焦点了,这在复杂的页面是非常有用的。HTML5中巧妙运用该属性发挥了很大的作用。

html5干货,干货:详解HTML5中常见的五大全局属性相关推荐

  1. html5录音兼容性,详解HTML5 录音遇到的坑

    本文恩主要介绍了详解HTML5 录音的踩坑之旅,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧,希望能帮助到大家. 说实话,一开始都没接触过 HTML5 的 Audio A ...

  2. html5 摄像头 直播,详解HTML5 使用video标签实现选择摄像头功能

    详解HTML5 使用video标签实现选择摄像头功能 1. html // jquery reference // // Open WebCam Snap Photo 2. javascript El ...

  3. .net html5页面缓存,详解HTML5中的manifest缓存使用

    起源html5之前的网页,都是无连接,必须联网才能访问,这其实也是web的特色,这其实对于PC是时代问题并不大,但到了移动互联网时代,设备终端位置不再固定,依赖无线信号,网络的可靠性变得降低,比如坐在 ...

  4. 线程池参数详解_java中常见的六种线程池详解

    之前我们介绍了线程池的四种拒绝策略,了解了线程池参数的含义,那么今天我们来聊聊Java 中常见的几种线程池,以及在jdk7 加入的 ForkJoin 新型线程池 首先我们列出Java 中的六种线程池如 ...

  5. 实例详解 EJB 中的六大事务传播属性--转

    前言 事务 (Transaction) 是访问并可能更新数据库中各种数据项的一个程序执行单元 (unit).在关系数据库中,一个事务可以是一条或一组 SQL 语句,甚至整个程序.它有通常被称为 ACI ...

  6. 网页中的盒模型css属性,详解CSS中的Box Model盒属性的使用

    页面上显示的每个元素(包括内联元素)都可以看作一个盒子,即盒模型( box model ).请看 Chrome DevTools 里的截图: 可以显而易见的看出盒模型由 4 部分组成.从内到外分别是: ...

  7. html5 页面 参数传递,详解html中页面跳转传递参数的问题

    效果如下图所示: a页面 点击跳转按钮后 在b页面可以获取到对应的值. 代码如下: a页面: a页面 $(function(){ name = $("#name").text(); ...

  8. html5应用测试方法,详解html5的video标签测试应用

    1.video标签的使用 属性:src(要播放的音频文件路径).autoplay(是否自动播放).control(进度条).loop(循环播放).onended(是否播放完毕的是一个事件) 2.实现了 ...

  9. 详解机器学习中常见的距离与Python实现

    在机器学习的很多算法,尤其是与聚类相关的算法中你会碰到各种各样的距离,欧式距离.马氏距离.切比雪夫距离等会让初学者头疼,如果只看书的话,大多书上就一行公式带过,看完还是迷迷糊糊,今天本文就来盘一盘机器 ...

最新文章

  1. 2432功率计使用说明_为什么说功率计是自行车开挂神器?
  2. 【BZOJ】1574: [Usaco2009 Jan]地震损坏Damage
  3. flask from app import db ImportError: cannot import name ‘db’ 的解决方案
  4. Qt Creator Qt快速最佳实践
  5. python算法与数据结构-冒泡排序算法
  6. MySQL存储引擎及InnoDB并发控制介绍
  7. python对象模型映射_【500 Lines or Less】-【翻译练习】-【chapter 14】-【简单对象模型】-【第一部分】...
  8. 二倍图css,css二倍图的使用
  9. 修改Flume-NG的hdfs sink解析时间戳源码大幅提高写入性能
  10. css 水印_Inpaint,一款简洁干净的去水印软件
  11. 解决Fedora14中文显示问题
  12. 【磨刀不误砍柴工】keil软件仿真评估代码运行时间
  13. 去掉Googl默认界面的logo下面的尴尬的文字,对面的菇凉请看过来!!!
  14. 十分钟带你解读什么是Promise异步编程
  15. 亲测有效,解决C盘空间不足问题
  16. HDU 1870 愚人节的礼物
  17. AppStore上线规则
  18. (精华2020年6月9日更新)Angular实战篇 axio的封装
  19. 远程遥控小车搭建记录
  20. Revit内建模型的基础教学分享

热门文章

  1. 定时任务 Scheduled quartz
  2. either fix the issues identified by lint, or modify your build script as follows
  3. docker中centos遇到sudo: command not found
  4. html检查输入为空,html input输入验证不为空
  5. php的strpos不支持数字,php使用strpos判断字符串中数字类型子字符串出错的解决方法 原创...
  6. javascript for in,for each,for循环遍历区别
  7. html的post和get请求参数,HTTP 方法:GET 对比 POST | w3cschool菜鸟教程
  8. 第13章 程序的动态加载和执行(二,用户代码)
  9. 【C语言进阶深度学习记录】十五 编译过程简介
  10. 《鸟哥的Linux私房菜--基础篇》学习