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+。
2.?兼容模式
自从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也把这个属性纳入标准,对其实现做出了明确规定。
3.??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。