Document类型

1.文档的子节点

 Document类型可以表示HTML页面或者其他基于XML的文档。不过,最常见的应用还是作为HTMLDocument实例的document对象。通过这个文档对象,不仅可以取得与页面有关的信息,而且还能操作页面的外观及其底层结构。

虽然DOM标准规定Document节点的子节点可以是DocumentType、Element、ProcessingInstruction或Comment,但还有两个内置的访问其子节点的快捷方式。第一个就是documentElement属性,该属性始终指向HTML页面中的<html>元素。另一个就是通过childNodes列表访问文档元素,但通过documentElement属性则能更快捷、更直接地访问该元素。

 
作为HTMLDocument的实例,document对象还有一个body属性,直接指向<body>元素。因为开发人员经常要使用这个元素,所以document.body在JavaScript代码中出现的频率非常高,
 

2.查找元素

说到最常见的DOM应用,恐怕就要数取得特定的某个或某组元素的引用,然后再执行一些操作了。取得元素的操作可以使用document对象的几个方法来完成。其中,Document类型为此提供了两个方法:getElementById()和getElementsByTagName()。

第一个方法,getElementById(),接收一个参数:要取得的元素的ID。如果找到相应的元素则返回该元素,如果不存在带有相应ID的元素,则返回null。注意,这里的ID必须与页面中元素的id特性(attribute)严格匹配,包括大小写。

 
IE8及较低版本不区分ID的大小写,因此"myDiv"和"mydiv"会被当作相同的元素ID。

如果页面中多个元素的ID值相同,getElementById()只返回文档中第一次出现的元素。IE7及较低版本还为此方法添加了一个有意思的“怪癖”:name 特性与给定 ID匹配的表单元素(<input>、<textarea>、<button>及<select>)也会被该方法返回。如果有哪个表单元素的name特性等于指定的ID,而且该元素在文档中位于带有给定ID的元素前面,那么IE就会返回那个表单元素。

 
 为了避免IE中存在的这个问题,最好的办法是不让表单字段的name特性与其他元素的ID相同。另一个常用于取得元素引用的方法是getElementsByTagName()。这个方法接受一个参数,即要取得元素的标签名,而返回的是包含零或多个元素的NodeList。在HTML文档中,这个方法会返回一个HTMLCollection对象,作为一个“动态”集合,该对象与NodeList非常类似。
 
 对HTMLCollection而言,我们可以向方括号中传入数值或字符串形式的索引值。在后台,对数值索引就会调用item(),而对字符串索引就会调用namedItem()。 
 要想取得文档中的所有元素,可以向getElementsByTagName()中传入"*"。在JavaScript及CSS中,星号(*)通常表示“全部”。
 

第三个方法,也是只有HTMLDocument类型才有的方法,是getElementsByName()。顾名思义,这个方法会返回带有给定name特性的所有元素。最常使用getElementsByName()方法的情况是取得单选按钮;为了确保发送给浏览器的值正确无误,所有单选按钮必须具有相同的name特性,与getElementsByTagName()类似,getElementsByName()方法也会返回一个HTMLCollectioin。

 

Document类型知识大全的更多相关文章

  1. Element类型知识大全

    Element类型 除了Document类型之外,Element类型就要算是Web编程中最常用的类型了.Element类型用于表现XML或HTML元素,提供了对元素标签名.子节点及特性的访问.   要 ...

  2. Node类型知识大全

    Node类型 1.节点关系 每个节点都有一个childNodes属性,其中保存着一个NodeList对象.NodeList是一种类数组对象,用于保存一组有序的节点,可以通过位置来访问这些节点.请注意, ...

  3. PHP知识大全

    --------------------------------------------------------- PHP知识大全 ---------------------------------- ...

  4. 从原型链看DOM--Document类型

    JavaScript通过Document类型表示文档,原型链的继承关系为:document.__proto__->HTMLDocument.prototype->Document.prot ...

  5. VC6.0调试知识大全

    VC6.0调试知识大全 分类: C++ 2010-09-06 21:33 7080人阅读 评论(5) 收藏 举报 debuggingmfcfunctionmenumicrosoftdll My Not ...

  6. .Net知识大全(个人整理)

    .Net知识大全 本章内容适用于对.NET有一定基础的或者是想通过本文章对.NET基础知识记不清楚的朋友,可以通过本文章进行回顾. 面试的时候可能也会遇到相应的题目,建议面试前进行回顾!!! 1.NE ...

  7. js DOM Document类型

    JavaScript通过Document类型访问文档.在浏览器中,document对象是HTMLDocument(继承自 Document类型)的一个实例,表示整个HTML页面.document对象是 ...

  8. Newtonsoft.Json C# Json序列化和反序列化工具的使用、类型方法大全 C# 算法题系列(二) 各位相加、整数反转、回文数、罗马数字转整数 C# 算法题系列(一) 两数之和、无重复字符的最长子串 DateTime Tips c#发送邮件,可发送多个附件 MVC图片上传详解

    Newtonsoft.Json C# Json序列化和反序列化工具的使用.类型方法大全   Newtonsoft.Json Newtonsoft.Json 是.Net平台操作Json的工具,他的介绍就 ...

  9. python知识大全目录,想学的看过来!

    Python总结篇——知识大全   python装饰器   PyCharm安装与配置,python的Hello World   sort与sorted的区别及实例   我必须得告诉大家的MySQL优化 ...

随机推荐

  1. 多线程下QAxObject指针为NULL的解决办法

    项目中需要对Excel进行操作,把数据中的数据写入到Excel文件中.在数据量大的情况下,操作Excel是一件费时的操作. 但是执行到下列代码时就会出现空指针的情况: QAxObject *excel ...

  2. 轮播插件、原生js编写,弄懂这个,基本上各种轮播都可以自己写了

    直接上代码了: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...

  3. 微信小程序红包开发 小程序发红包 开发过程中遇到的坑 微信小程序红包接口的

    最近公司在开发一个小程序红包系统,客户抢到红包需要提现.也就是通过小程序来给用户发红包. 小程序如何来发红包呢?于是我想到两个方法. 之前公众号开发一直用了的.一个是红包接口,一个是企业支付接口.一开 ...

  4. NOI 2005维护数列

    题目描述 请写一个程序,要求维护一个数列,支持以下 6 种操作:(请注意,格式栏 中的下划线‘ _ ’表示实际输入文件中的空格) 输入输出格式 输入格式: 输入文件的第 1 行包含两个数 N 和 M, ...

  5. java 数据格式验证类

    作为一个前端,懂一点java,php之类的,甚好. 我所在的项目前端采用的就是java的spring mvc框架,所以我们也写java,掐指一算,也快一年了. 前端而言,验证是一个坎,绕不过去的,前面 ...

  6. 浅谈 URI 及其转义

    URI URI,全称是 Uniform Resource Identifiers,即统一资源标识符,用于在互联网上标识一个资源,比如 https://www.upyun.com/products/cd ...

  7. vagrant快速搭建LNMP环境并且打包带走留着以后用

    不多说废话,全文文字,照着输就没问题 vagrant下载 可以到VirtualBox的官网进行下载:  https://www.virtualbox.org/wiki/Downloads vagran ...

  8. [译]what is bootstrap

    Question:Bootstrap的定义?有什么用?如何助力前端开发?   Answers: 它是一个在用HTML,CSS和javascript创建网站和网页应用的时候可以用到的基础内容. More ...

  9. 【Java】synchronized与lock的区别

    从Java 5之后,在java.util.concurrent.locks包下提供了另外一种方式来实现同步访问,那就是Lock. 也许有朋友会问,既然都可以通过synchronized来实现同步访问了 ...

  10. 数据库系统的基本概念(第一章)-----数据库管理系统(DBMS

    DBMS的工作模式 数据库管理系统(DBMS)是指数据库系统中对数据进行管理的软件系统,它是数据库系统的核心组成部分,对数据库的一切操作(增删改查)都是通过DBMS进行的 DBMS的工作模式如下: 1 ...