通过name选择元素(getElementsByName)
2.1 使用方式,document.getElementsByName(‘domName’),domName需要选择元素的name属性的值
2.2 说明:
a. 返回值是一个nodeList集全(区别于array)
b. 和id属性不一样,name属性只在少数的dom元素中有效(form, input, iframe, img),方便表单数据提交
2.3 兼容性:IE中id属性匹配的元素也会一起返回
通过标签名获取元素(getElementsByTagName)
3.1 使用方式:document.getElementsByTagName(‘tagname’),dom元素里的标签名
3.2 说明:
a. 返回的结果是一个nodeList
b. 只能选取调用该方法的元素的后代元素
c. tagName不区分大小写的
d. 当tagName为*时,表示选取所有的元素(需遵从规则b)
通过css类选择器选取元素(getElementsByClassName)
4.1 使用方式:document.getElementsByClassName(‘className’),className标签里的class属性的值
4.2 说明:
a. 返回的结果是一个nodeList
b. 只能返回该方法元素的后代元素
4.3 兼容性:IE8及其以下的版本本浏览器没有实现这个方法
通过CSS选择器选取元素(querySelector, querySelectorAll)
5.1 使用方式,document.querySelector(‘selector’)/document.querySelectorAll(‘selector’),querySelector只返回第一个符合条件的元素,querySelectorAll返回所有符合条件的元素
5.2 说明:
a. 返回值是一个nodeList
5.3 兼容性:IE8及其以下的版本只支持CSS2样式的选择器语法