操作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. Matlab中编译C++文件

    今天在跑<Robust Object Tracking via Sparsity-based Collaborative Model>这篇文章的代码时候,发现出现如下错误: 发现错误时由于 ...

  2. 喵星人教你记 HTTP 状态码

    记忆HTTP状态码是有一些困难的,因为状态码很多且很难记忆.GirlieMac,也就是Tomomi Imura利用她巧妙的构思,PS了一系列的HTTP状态信息.在你看过这些图片之后,你绝对可以记住一些 ...

  3. C#中的Attribute和Java中的Annotation

    在之前的博客中介绍过C#的Attribute(特性),简单的说,特性主要就是利用反射技术,在运行期获取关注类的相关标注信息,然后利用这些标注信息对关注的类进行处理,最近因为工作的原因,需要看一下Jav ...

  4. Django admin site(二)ModelAdmin methods

    ModelAdmin methods save_model(request, obj, form, change) 此方法为admin界面用户保存model实例时的行为.request为HttpReq ...

  5. 图像二值化----otsu(最大类间方差法、大津算法)

    最大类间方差法是由日本学者大津于1979年提出的,是一种自适应的阈值确定的方法,又叫大津 法,简称OTSU.它是按图像的灰度特性,将图像分成背景和目标2部分.背景和目标之间的类间方差越大,说明构成图像 ...

  6. ios高版本SDK在低版本真机调试

    将build settings的ios deployment target改为对应真机系统版本即可

  7. C# 对象与JSON串互相转换

    using System;using System.IO;using System.Text;using Newtonsoft.Json; namespace OfflineAcceptControl ...

  8. ASP.NET Web API上实现 Web Socket

    1. 什么是Web Socket Web Socket是Html5中引入的通信机制,它为浏览器与后台服务器之间提供了基于TCP的全双工的通信通道.用以替代以往的LongPooling等comet st ...

  9. Android adb 常用技巧

    1.在命令行管理模拟器设备(AVD) list:列出机器上所有已经安装的Android版本和AVD设备 list avd:列出机器上所有已经安装的AVD设备: list target:列出机器上所有已 ...

  10. ZOJ 1610 Count the Colors (线段树 成段更新)

    题目链接 题意:成段染色,初始为0,每次改变一个区间的颜色,求最后每种颜色分别有多少段.颜色按照从 小到大输出. 分析:改变了代码的风格,因为看了学长的博客.直接用数组,可以只是记录节点的编号,因为节 ...