JS获取HTML和DOM元素的方法

JS获取HTML DOM元素的方法

JS获取DOM元素的方法
document.getElementById() 根据id获取元素

document.getElementsByTagName() 根据标签名获取标签列表

document.getElementsByName() 根据Name获取标签列表

document.getElementsByClassName(新) 根据Class获取标签列表

document.querySelector(新) 根据选择器获取第一个元素

document.querySelectorAll(新) 根据选择器获取所有标签名的元素

document.documentElement() 获取html标签

document.body() 获取body标签

根据id获取元素(getElementById)
document.getElementById(“id”);
1、上下文必须是document;
2、必须传参数，参数是string类型，是获取元素的id;
3、返回值只获取到一个元素，没有找到返回null;

根据标签名获取标签列表(getElementsByTagName)

1.上下文可以是document，也可以是一个元素，注这个元素必须存在;
2.参数是获取元素的标签名属性，没有区分大小写;
3.返回值是一个类数组，没有找到返回空数组;
getElementsByTagName这个方法除了可以使用document以外，还可以使用元素调用如果使用元素调用，就是指当前这个元素的子元素中的标签名是div的
下面两个方法获取的都是HTMLCollection HTML列表：
var divs=diva.getElementsByTagName(“div”); 根据id名来找div内部子元素的div
var divs=document.getElementsByTagName(“div”); 直接找到body里面的所有div

根据Name获取标签列表(getElementsByName)
document.getElementsByName(“name”);
1.上下文必须是document;
2.必须传参数，参数是获取元素的name属性;
3.返回值是一个类数组，没有找到返回空数组;

根据Class获取标签列表(getElementsByClassName)
document.getElementsByClassName(“div”);
1.上下文可以是document，也可以是一个元素;
2.参数是元素的类名;
3.返回值是一个类数组，没有找到返回空数组;
用法和getElementsByTagName差不多；

根据选择器获取第一个元素(querySelector)
document.querySelector(“div”);

1.上下文可以是document，也可以是一个元素;
2.参数是选择器，如：“div .className”;
3.返回值只获取到一个元素;
注：仅用于IE8以后；

根据选择器获取所有标签名的元素(querySelectorAll)
document.querySelector(“div”);

1.上下文可以是document，也可以是一个元素;
2.参数是选择器，如：“div .className”;
3.返回值是一个类数组;
用法和querySelector差不多；
注：仅用于IE8以后；

获取html标签（document.documentElement）
document.documentElement是专门获取html这个标签的;

获取body标签（document.body）
document.body是专门获取body这个标签的;