操作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. Linux多线程编程和Linux 2.6下的NPTL

    Linux多线程编程和Linux 2.6下的NPTL 在Linux 上,从内核角度而言,基本没有什么线程和进程的区别--大家都是进程.一个进程的多个线程只是多个特殊的进程他们虽然有各自的进程描述结构, ...

  2. python list去重的方法

    转载于:http://yxmhero1989.blog.163.com/blog/static/112157956201381443244790/ Python很简洁 我们喜欢简单有效的代码   一. ...

  3. centos防火墙设置

    1.查看 service iptables status 2.开关 service iptables start/stop 3.开机启动 chkconfig iptables on/off 4.编辑端 ...

  4. nyoj-291 互素数个数 欧拉函数

    LK的数学题 时间限制:1000 ms  |  内存限制:65535 KB 难度:3   描述 LK最近遇到一个问题,需要你帮她一下.一个整数n,求[1,n)中,和n互素的数的个数.   输入 多组测 ...

  5. hdu 3501 Calculation 2 (欧拉函数)

    题目 题意:求小于n并且 和n不互质的数的总和. 思路:求小于n并且与n互质的数的和为:n*phi[n]/2 . 若a和n互质,n-a必定也和n互质(a<n).也就是说num必定为偶数.其中互质 ...

  6. 概述什么是OSGi框架

    现 在越来越多的Java开发人员在谈论OSGi是有其道理的.在几年前上学的时候我进行了比较多的Eclipse插件开发,当时就亲身感觉到Eclipse 插件体系的灵活与强大,而该体系与OSGi也可谓一脉 ...

  7. 函数lock_rec_bitmap_reset

    /*********************************************************************//** Resets the record lock bi ...

  8. bzoj2466: [中山市选2009]树

    同上一题.(应该可以树形dp,然而我不会... #include<cstdio> #include<cstring> #include<iostream> #inc ...

  9. ASP.NET MVC实现多个按钮提交事件

    有时候会遇到这种情况:在一个表单上需要多个按钮来完成不同的功能,比如一个简单的审批功能. 如果是用webform那不需要讨论,但asp.net mvc中一个表单只能提交到一个Action处理,相对比较 ...

  10. [转] Jquery滚动加载

    原文地址:http://hi.baidu.com/vipxiaofan/item/9eb927b795671f77254b0985 另外一个asp.net的例子:http://blog.csdn.ne ...