首页 > 编程笔记 > JavaScript笔记 > JS DOM 阅读:701

JS document(文档节点)详解

文档节点代表整个 HTML 文档,在 JavaScript 中使用 document 即可访问。document 也叫“根节点”,它是文档内其他节点的访问入口,提供了操作其他节点的方法。主要特征值:nodeType 等于 9、nodeName 等于 "#document"、nodeValue 等于 null、parentNode 等于 null、ownerDocument 等于 null。

在 HTML 文档中,文档节点是唯一的,也是只读的。

访问文档

在不同环境中,获取文档节点的迭代不同。具体说明如下:

访问子节点

文档子节点包括以下类型:
访问方法说明如下:

访问特殊元素

文档中存在很多特殊元素,使用下面的方法可以获取,若获取不到则返回 null。

访问元素集合

document 包含一组集合对象,使用它们可以快速访问文档内元素,简单说明如下:

访问文档信息

document 包含很多信息,简单说明如下:

静态信息

状态信息

访问文档元素

document 对象包含多个访问文档内元素的方法,简单说明如下:
getElementsByName() 方法返回的是一个 HTMLCollection 对象,与 nodeList 对象类似,可以使用方括号语法或者 item() 方法访问 HTMLCollection 对象中的元素,并通过 length 属性取得这个对象中元素的数量。

示例

HTMLCollection 对象还包含一个 namedItem() 方法,该方法可以通过元素的 name 特征取得集合中的项目。下面示例可以通过 namedItem("news"); 方法找到 HTMLCollection 对象中 name 为 news 的图片。
<img src="1.gif" />
<img src="2.gif" name="news" />
<script>
    var images = document.getElementsByTagName("img");
    var news = image.namedItem("news");
</script>
还可以使用下面用法获取页面中所有元素,其中参数*表示所有元素。
var  allElements = document.getElementsByTagName("*");

爱面试的程序媛,一个分享面试经验的公众号。跟着站长一起学习,每天都有进步。

通俗易懂,深入浅出,定时分享程序员面试的那点事。

面试如何造火箭?工作如何拧螺丝?都在这个公号哦。

扫描二维码关注公众号,免费领取价值 1000 元的求职面试资料(限时免费)!

当你决定关注「爱面试的程序媛」,你已然超越了90%的程序员!

爱面试的程序媛二维码
微信扫描二维码关注

所有教程

优秀文章