Document类型

Document类型可以表示HTML页面或其他XML文档，但最常用的是通过HTMLDocument的实例取得document对象。document是window对象的属性，因此是一个全局对象。

Document有如下特征：

nodeType等于9
nodeName值为"#document"
子节点可以是DocumentType（最多一个）、Element（最多一个）、ProcessingInstruction（任意多个）、Comment（任意多个）、Text（任意多个）

ProcessingInstruction 是写给软件看的“注释指令”，不是显示给用户的，写法像 <?...?>，且规范允许它作为 Document 的直接子节点。

想获取html元素的时候，虽然可以用 document.childNodes，但更常用的是 document.documentElement，它指向根元素（即 html 标签）。

想获取body元素的时候，用 document.body 即可。

想获取<!DOCTYPE>元素的时候，用 document.doctype 即可。

Comment，即注释（形如）可以用 document.comments 来获取。

标题也可以获取，使用document.title即可。这一个值也可以被赋值。

URL、domain和referrer可以分别使用document.URL、document.domain和document.referrer来获取。

domain是可以设置的，但不能给它设置URL中不包含的值。

例如，A站点URL里是www.abc.com，B站点URL里是www.def.com，它们的domain不能设置为相同的值。

又如，A站点URL里是www.abc.com，B站点URL里是pick.abc.com，它们的domain可以设置为相同的值，可以设置为abc.com。

放松了就不能再收紧，即不能从abc.com再设回www.abc.com。

当页面里有frame或iframe时，设置domain为相同的值可以避免跨域，使得页面间可以通信。

定位元素

可以使用 document.getElementById() 来获取指定id的元素。大小写敏感。多个相同ID仅返回第一个出现的元素。

const element = document.getElementById('id');
console.log(element);

可以使用 document.getElementsByTagName() 来获取指定标签名的元素。该方法获得的是HTMLCollection对象。

const elements = document.getElementsByTagName('tag');
console.log(elements);

可以用 namedItem 来获取指定名称的元素。

<img src="pic.png" name="imgName" />

const element = document.getElementsByTagName('img')[0];
const imgTag = element.namedItem('imgName');
// 也可以用中括号获取
// const imgTag = element['imgName']
console.log(imgTag);

document.getElementByTagName("*"); // 获取文档中所有元素

可以使用 document.getElementsByName() 来获取指定名称的元素。该方法获得的是HTMLCollection对象。如果用namedItem()方法来获取元素的子节点，由于name可能多个标签用同一个name，所以得到的是第一项。

const elements = document.getElementsByName('name');
console.log(elements);

可以使用 document.getElementsByClassName() 来获取指定类名的元素。

const elements = document.getElementsByClassName('class');
console.log(elements);

可以使用 document.querySelector() 来获取指定选择器的元素。

const element = document.querySelector('selector');
console.log(element);

其他的集合（均是HTMLCollection的实例）：

document.anchors，获取文档中所有带name属性的a元素。
document.forms，获取文档中所有form元素。
document.images，获取文档中所有图片元素。
document.links，获取文档中所有带href属性的a元素。

文档写入

向网页输出流中写入内容。对应4个方法：write()、writeln()、open()、close()。

write()和writeln()方法都接收一个字符串参数，将这个字符串写入网页中。writeln会额外加个换行。适用于页面加载期间向页面中动态添加内容。

<html>
<head>
  <title>document.write() Example</title>
</head>
<body>
  <script type="text/javascript">
    document.write("<script type=\"text/javascript\" src=\"file.js\">"+"<\/script>");
  </script>
</body>
</html>