DOM 获取元素

 

2.获取元素

2.1如何获取页面元素

DOM在我们实际开发中主要用来操作元素。我们如何来获取页面中的元素呢?
获取页面中的元素可以使用以下几种方式:

1、根据ID获取
2、根据标签名获取
3、通过HTML5新增的方法获取

4、特殊元素获取
 

1、getElementById()   通过id获取

 console.dir    打印返回的元素对象

2、根据标签名获取   getElementsByTagName()

使用   getElementsByTagName()   方法可以返回带有指定标签名的对象的集合。

document.getElementsByTagName('标签名');

注意︰

1．因为得到的是一个对象的集合，所以我们想要操作里面的元素就需要遍历。
2．得到元素对象是动态的

注意∶父元素必须是单个对象(必须指明是哪一个元素对象).获取的时候不包括父元素自己。

3、getElementsByClassName()

4、querySelector（）

5、querySelectorAll（）

2.4通过HTML5新增的方法获取

1. document.getElementsByClassName( '类名');  //根据类名返回元素对象集合
2. document.queryselector('选择器');   //根据指定选择器返回第一个元素对象
3. document.queryselectorAll( '选择器'); //根据指定选择器返回

2.5获取特殊元素( body , html )

获取body元素
doucumnet.body     返回body元素对象
 

获取html元素
 document.documentElement    返回html元素对象