脚本化文档(1)

DOM概览

脚本化文档(1)_第1张图片
HTML文档的树状表示

上图的每个方框是文档的一个节点,它表示一个Node对象。

脚本化文档(1)_第2张图片
Node节点的继承关系

注意,通用的Document和Element类型与HTMLDocument和HTMLElement类型之间是有严格的区别的。Document类型代表一个 HTML或XML文档,Element类型代表该文档中的一个元素。HTMLDocument和HTMLElement子类 只是针对于HTML文档和元素

选择文档元素

获取文档的一个或多个元素有如下方法:

  • 用指定的id属性
  • 用指定的name属性
  • 用指定的标签名字
  • 用指定的CSS类(class属性)
  • 用指定的CSS选择器

通过ID选取元素

可以用Document对象的getElementById()方法选取一个基于唯一ID的元素,返回包含单个Element的Node对象

// 选择id为"section1"的唯一元素
var section1 = document.getElementById("section1");

通过name选择元素

区别于id,name属性的值不是必须唯一,多个元素可以有同样的名字。
getElementsByName()定义在HTMLDocument类中,而不是在Document类中,所以它只针对HTML文档可用,返回包含多个Elements的NodeList对象
注意:对于