DOM学习笔记

 

1.DOM（document object model）文档对象模型

document.getElementById(string) => 获取文档中id为string的元素，其返回的是一个HTMLElement元素。

document.getElementsByTagName(string) =>获取文档中标签名为string的元素，其返回的是一个HTMLCollection，伪数组。

document.getElementsByClassName(string) =>获取文档中class='string'的元素，其返回的是一个HTMLCollection，伪数组。

document.getElementsByName(string) =>获取文档中name='string'的元素，其返回的是一个NodeList，伪数组。

其中getElementById和getElementsByName只能是document的方法，即元素不能拥有该方法，因为id,name都能直接找到了该元素。

 

document.querySelector(selector) =>返回一个HTMLElement元素。

documnet.querySelectorAll(selector) =>返回一个NodeList对象,NodeList为静态的，若DOM中添加、删除等操作不会反映在NodeList中。

 

其中NodeList与HTMLCollection的关系：由于历史原因（DOM4之前，实现该接口的集合只能包含 HTML 元素），该接口被称为 HTMLCollection;

HTMLCollection:

　　 属性：length

　　方法：item(index); 不过一般直接使用下标来取元素

NodeList:

　　属性：length

　　方法：item(index),

　　　　　entries(),values(),keys() =>返回一个迭代器

　　　　　forEach()

元素的属性：childNodes  => NodeList

　　　　　　children => HTMLCollection