DOM

DOM:document object model

对网页进行增删改查的操作。

按ID精确查找一个元素

var element = document.getElementById("ID");
//效率非常高

强调：只能用在document上

何时使用：只用于精确查找一个元素

问题：不是所有元素都有ID

按标签查找

var element = parent.getElementByTagName("tag");
//查抄指定parent节点下的所有标签为tag的子代节点

强调：

• 可以用在任意父元素上
• 不仅查直接子节点，还查找所有子代节点
• 返回一个动态几个
• 即使值找到一个元素，也返回集合
• 必须用[n]取出唯一元素

问题：不但找直接，而且找所有子代。

通过name属性查找

var element = document.getElementByName("name属性值");

可以返回DOM树中具有指定name属性值得所有子元素集合。

通过class查找

var element = parent.getElementByClassName("class");
//查找父元素下指定class属性的元素
//有兼容性问题:IE9+

通过css选择器查找

var element = parent.querySelector("selector");
//只找一个元素

强调：selector支持一切CSS中的选择器

强调：如果选择器匹配的有多个，只返回第一个

var element = parent.querySelectAll("selector");
//找多个

强调：selector API 返回的是非动态集合。