美文网首页Web前端之路让前端飞JavaScript 进阶营
HTML5扩展了 HTMLDocument ,增加了新的功能。

HTML5扩展了 HTMLDocument ,增加了新的功能。

作者: 前端精髓 | 来源:发表于2017-09-18 14:14 被阅读146次

HTML5扩展了 HTMLDocument ,增加了新的功能。与HTML5中新增的其他DOM扩展类似,这些变化同样基于那些已经得到很多浏览器完美支持的专有扩展。所以,尽管这些扩展被写入标准的时间相对不长,但很多浏览器很早就已经支持这些功能了。

  1. readyState 属性

IE4最早为 document 对象引入了 readyState 属性。然后,其他浏览器也都陆续添加这个属性,最终HTML5把这个属性纳入了标准当中。Document 的 readyState 属性有两个可能的值:

  • loading ,正在加载文档;
  • complete ,已经加载完文档。

使用 document.readyState 的最恰当方式,就是通过它来实现一个指示文档已经加载完成的指示器。在这个属性得到广泛支持之前,要实现这样一个指示器,必须借助onload 事件处理程序设置一个标签,表明文档已经加载完毕。 document.readyState属性的基本用法如下。

JS

if (document.readyState == “complete”){
    //执行操作
}

支持 readyState 属性的浏览器有IE4+、Firefox 3.6+、Safari、Chrome和Opera 9+。

  1. 兼容模式

自从IE6开始区分渲染页面的模式是标准的还是混杂的,检测页面的兼容模式就成为浏览器的必要功能。IE为此给 document 添加了一个名为 compatMode 的属性,这个属性就是为了告诉开发人员浏览器采用了哪种渲染模式。就像下面例子中所展示的那样,在标准模式下, document.compatMode 的值等于 “CSS1Compat” ,而在混杂模式下, document.compatMode 的值等于 “BackCompat” 。

JS

if (document.compatMode ==  “CSS1Compat”){
    alert(“Standards mode”);
} else {
    alert(“Quirks mode”);
}

后来,陆续实现这个属性的浏览器有Firefox、Safari 3.1+、Opera和Chrome。最终,HTML5也把这个属性纳入标准,对其实现做出了明确规定。

  1. head 属性

作为对 document.body 引用文档的 <body> 元素的补充,HTML5新增了 document.head属性,引用文档的 <head> 元素。要引用文档的 <head> 元素,可以结合使用这个属性和另一种后备方法。

JS

var head = document.head || document.getElementsByTagName(“head”)[0];

如果可用,就使用 document.head ,否则仍然使用 getElementsByTagName() 方法。

实现 document.head 属性的浏览器包括Chrome和Safari 5。

相关文章

  • HTML5扩展了 HTMLDocument ,增加了新的功能。

    HTML5扩展了 HTMLDocument ,增加了新的功能。与HTML5中新增的其他DOM扩展类似,这些变化同样...

  • Document对象描述

    Document 对象描述HTMLDocument 接口对 DOM Document 接口进行了扩展,定义 HTM...

  • 前端入门06 -- HTML5和CSS3提高,项目实战

    HTML5新特性 HTML5的新增特性主要是针对以前的不足,增加了一些新的标签,新的表单和新的表单特性; 这些新增...

  • HTML5表单

    Html5增加了一些新的特性 form属性Html5之前所有的表单属性都要放到form里面,新增了form属性后,...

  • Spring Boot 菜鸟教程 8 EasyUI edatag

    edatagrid扩展组件 edatagrid组件是datagrid的扩展组件,增加了统一处理CRUD的功能,可以...

  • 网络编程(五)之HTML5和CSS3提高

    一、 HTML5的新特性 HTML5 的新增特性主要是针对于以前的不足,增加了一些新的标签、新的表单和新的表单属性...

  • 【iOS】推送

    【1】iOS推送功能流程 【2】iOS10之后增加了扩展之后的推送功能流程

  • HTML5新标签

    HTML5新特性 概述 HTML5 的新增特性主要是针对于以前的不足,增加了一些新的标签、新的表单和新的表单属性等...

  • 浅谈HTML5与HTML

    随着HTML5语言的成熟,HTML5的应用越来越广泛。那相对于之前的HTML4.0版本,HTML5增加了哪些新...

  • css 面试题

    1.请说出几个html5新特性 答:html5增加的新特性具体为: 1、新增的语义/结构化标签,如增加了foote...

网友评论

    本文标题:HTML5扩展了 HTMLDocument ,增加了新的功能。

    本文链接:https://www.haomeiwen.com/subject/lncbsxtx.html