文档元素选取和遍历中的一些容易忘记的概念

选取文档元素

  • getElementById

根据元素的id属性值,来选取元素,在低于IE8的浏览器中,id不区分大小写,并且对于某些元素也匹配它的name属性值。

  • getElementsByName:

根据元素的name属性查找元素。在IE9以前的版本中,对于表单(form),表单元素(input area等),img,iframe等元素也会匹配对应的id值,为了兼容性,不应将同样的值同时分配给不同元素的id和name属性(id和name设置同样的值是没有问题的)。

并且和window对象一样,其中设置了id属性的元素,并且以这个属性值作为变量名的变量还未被使用,会自动成为window或document对象的属性。在window对象中这些元素有以下几种:<a>,<area>,<applet>,<embed>,<form>,<frame>,<frameset>,<iframe>,<img>,<object>。在document对象中只有以下几种<form><img><iframe><applet><embed><object>

  • getElementsByTagName
  • getElementsByClassName
  • querySelectorAll

选取的元素是非实时的。

  • querySelector

文档元素的遍历

两种类型的API用于DOM遍历

1.将DOM看成一个节点树(Node Tree)

  • parentNode
  • childNodes
  • firstChild, lastChild
  • nextSibling, previoursSibling
  • nodeType, nodeValue, nodeName

2.将DOM看成一个元素树(Element Tree)

  • children
  • firstElementChild, lastElementChild
  • nextElementSibling, previoursElementSibling
  • childElementCount
原文地址:https://www.cnblogs.com/hsnow/p/4200543.html