操作HTML文档的第一步就是获取对文档元素的引用,每一个元素在DOM中就是一个节点,所有的元素在DOM中构成一个节点树。

用于获取元素节点定义的方法定义于HTMLDocument接口,window.document方法用于实现该接口,其定义的常用方法和属性如下:

属性或方法 返回值类型 说明
[getter] 任何类型 根据元素的name属性获取所有元素节点
all HTMLAllCollection 文档中所有元素组成的集合,已不推荐使用
body HTMLElement 获取<body>元素节点
head HTMLHeadElement 获取<head>元素节点
images HTMLCollection 获取所有<img>元素节点
embeds HTMLCollection 获取所有<embed>元素节点
plugins HTMLCollection 等同于embeds属性
links HTMLCollection 获取所有带href属性的<a>和<area>元素节点
forms HTMLCollection 获取所有<form>元素节点
scripts HTMLCollection 获取所有<script>元素节点
getElementsByName() NodeList 根据元素的name属性获取所有元素节点
getElementsByClassName() NodeList 根据元素的class属性获取所有元素节点

另外,HTMLDocument接口也继承了Core DOM的Document接口,继承的属性和方法如下:

属性或方法 返回值类型 说明
documentElement Element 获取xml或者html的根元素,在html中即<html>
getElementById() Element 根据ID属性值获取指定元素
getElementsByTagName() NodeList 根据元素名称获取所有元素节点
getElementsByTagNameNS() NodeList 根据指定的命名空间的元素名获取所有元素节点

DOM笔记(一):HTMLDocument接口的更多相关文章

  1. DOM笔记(三):Element接口和HTMLElement接口

    一.Element接口 Element接口表示一个元素,该接口扩展自Node接口,自然继承了Node接口的属性和方法,也有一套针对元素的属性和方法. Element接口常见的属性比较少,常用的就是一个 ...

  2. DOM笔记(二):Node接口

    所有的节点都使用Node接口来表示,可以使用很多方法去获取节点,如document.getElementsByTagName().document.getElementsByName()等均返回一个N ...

  3. DOM笔记(四):HTML 5 DOM复杂数据类型

    HTML 5 DOM定义了一下集合.列表等复杂的数据类型用于实现便捷的操作.相对于HTML 4 DOM,HTML 5 DOM增加了HTMLCollection.DOMTokenList.DOMStri ...

  4. DOM笔记(十三):JavaScript的继承方式

    在Java.C++.C#等OO语言中,都支持两种继承方式:接口继承和实现继承.接口继承制继承方法签名,实现继承则继承实际的方法和属性.在SCMAScript中,由于函数没有签名,所以无法实现接口继承, ...

  5. DOM对象模型四大基本接口

    本文向大家描述一下DOM对象模型的四个基本接口,在DOM对象模型接口规范中,有四个基本的接口:Document,Node,NodeList以及NamedNodeMap. 在DOM对象模型接口规范中,有 ...

  6. DOM笔记(十):JavaScript正则表达式

    一.RegExp ECMAScript通过RegExp类型类支持正则表达式,语法和Perl类似: var exp = /pattern/flags; patternb部分是任何简单的或复杂的正则表达式 ...

  7. DOM笔记(七):开发JQuery插件

    在上一篇笔记本中,讲解了如何利用jQuery扩展全局函数和对象:DOM笔记(六):怎么进行JQuery扩展? 在这篇笔记本中,将开发一个简单的动画插件,名称是example-plugin,用其实现一个 ...

  8. DOM笔记(五):JavaScript的常见事件和Ajax小结

    一.常见事件类型 1.鼠标事件 事件名称 说明 onclick 鼠标单击时触发 ondbclick 鼠标双击时触发 onmousedown 鼠标左键按下时触发 onmouseup 鼠标释放时触发 on ...

  9. Typescript 学习笔记六:接口

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

随机推荐

  1. ios开发--27个提升效率的iOS开源库推荐

    超长慎入列表: DZNEmptyDataSet(UI,空表格视图解算器) PDTSimpleCalendar(UI,drop-in日历组件) MagicalRecord(实施活跃记录模式的Core D ...

  2. Arc Engiene读取文档的属性

    设计界面 创建类 代码如下 using System; using System.Collections.Generic; using System.Linq; using System.Text; ...

  3. windows环境下安装 zookeeper

    我们下载下来的zookeeper的安装包是.tar.gz格式的,但是还是可以在windows下运行. 下载地址 http://mirrors.hust.edu.cn/apache/zookeeper/ ...

  4. NC / Netcat - 文件传输

    文件传输:将文件从B用户机器传输到A用户机器. 实验环境1: A用户,windows系统,IP:192.168.12.109 B用户,linux系统,IP:192.168.79.3 A用户作为接受传输 ...

  5. MVC运行原理

    Global.asax Global.asax 文件,有时候叫做 ASP.NET 应用程序文件,提供了一种在一个中心位置响应应用程序级或模块级事件的方法.你可以使用这个文件实现应用程序安全性以及其它一 ...

  6. tomcat升级问题

    在本地开发使用myeclipse6.5自带tomcat,部署到服务器上是7.x,导致jsp页面无法解析. 所以想着在本地也使用tomcat7部署,myeclipse6.5不支持tomcat7.x,到网 ...

  7. MFC编程入门

    一. 什么是MFC? 如果你要建立一个Windows应用程序,应该如何下手? 好的开端是从设计用户界面开始. 首先,你要决定什么样的用户能使用该程序并根据需要来设置相应的用户界面对象.Windows用 ...

  8. SVN update: 'skipped' message

    在eclipse中用svn插件同步google code老是服务器连接time out!就只有通过检出项目再更新啦,结果遇到个SVN update: 'skipped' message问题,还是sta ...

  9. JVM学习笔记(一)------基本结构

    从Java平台的逻辑结构上来看,我们可以从下图来了解JVM: 从上图能清晰看到Java平台包含的各个逻辑模块,也能了解到JDK与JRE的区别 对于JVM自身的物理结构,我们可以从下图鸟瞰一下: 对于J ...

  10. maven项目配置Jetty服务器

    <plugin> <groupId>org.mortbay.jetty</groupId> <artifactId>jetty-maven-plugin ...