HTMLDocument 扩展

HTML5 扩展了 HTMLDocument 类型，增加了更多功能。与其它 HTML5 定义的 DOM 扩展一样，这些变化同样基于所有浏览器事实上都已经支持的专有扩展。为此，即使这些扩展的标准化相对较晚，很多浏览器也早就实现了相应的功能。

readyState 属性

readyState 是 IE4 最早添加到 document 对象上的属性，后来其它浏览器也都依葫芦画瓢地支持这个属性。最终， HTML5 将这个属性写进了标准。

document.readyState 属性有两个可能的值：

loading ，表示文档正在加载
complete ，表示文档加载完成

实际开发中，最好是把 document.readState 当成一个指示器，以判断文档是否加载完毕。在这个属性得到广泛支持以前，通常要依赖 onload 事件处理程序设置一个标记，表示文档加载完了。

if (document.readyState == 'complete') {
  //  执行操作;
}

compatMode

自从 IE6 提供了以标准或混杂模式渲染页面的能力之后，检测页面渲染模式成为一个必要的需求。 IE 为 document 添加了 compatMode 属性，这个属性唯一的任务是指示浏览器当前处于什么渲染模式。如下面的例子所示，标准模式下 document.compatMode 的值是"CSS1Compat"，而在混杂模式下， document.compatMode 的值是"BackCompat"。

if (document.compatMode == 'CSS1Compat') {
  console.log('Standards mode');
} else {
  console.log('Quirks mode');
}

head 属性

作为对 document.body （指向文档的<body>元素）的补充， HTML5 增加了 document.head 属性，指向文档的<head>元素。

字符集属性

HTML5 增加了几个与文档字符集有关的新属性。其中， characterSet 属性表示文档实际使用的字符集，也可以用来指定新字符集。这个属性的默认值是"UTF-16"，但可以通过<meta>元素或响应头，以及新增的 characterSet 属性来修改。

console.log(document.characterSet);
// "UTF-16" document.characterSet = "UTF-8";

scrollIntoView()

scrollIntoView()方法存在于所有 HTML 元素上，可以滚动浏览器窗口或容器元素以便包含元素进入视口。

alignToTop 是一个布尔值
true ：窗口滚动后元素的顶部与视口顶部对齐
false ：窗口滚动后元素的底部与视口底部对齐
scrollIntoViewOptions 是一个选项对象
behavior ：定义过渡动画，可取的值为"smooth"和"auto"，默认为"auto"
block ：定义垂直方向的对齐，可取的值为"start"、"center"、"end"和"nearest"，默认为 "start"
inline ：定义水平方向的对齐，可取的值为"start"、"center"、"end"和"nearest"，默认为 "nearest"
不传参数等同于 alignToTop 为 true

// 确保元素可见
document.forms[0].scrollIntoView();
//同上
document.forms[0].scrollIntoView(true);
document.forms[0].scrollIntoView({
  block: 'start',
}); //尝试将元素平滑地滚入视口
document.forms[0].scrollIntoView({
  behavior: 'smooth',
  block: 'start',
});

专有扩展

children 属性

IE9 之前的版本与其它浏览器在处理空白文本节点上的差异导致了 children 属性的出现。 children 属性是一个 HTMLCollection ，只包含元素的 Element 类型的子节点。

contains()方法

DOM 编程中经常需要确定一个元素是不是另一个元素的后代。 IE 首先引入了 contains()方法，让开发者可以在不遍历 DOM 的情况下获取这个信息。 contains()方法应该在要搜索的祖先元素上调用，参数是待确定的目标节点。

如果目标节点是被搜索节点的后代， contains()返回 true ，否则返回 false 。

readyState 属性​

compatMode​

head 属性​

字符集属性​

scrollIntoView()​

专有扩展​

children 属性​

contains()方法​