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。

转载于:https://www.cnblogs.com/wuxianqiang/p/6765046.html

Document类型知识大全相关推荐

  1. 计算机硬盘的种类,硬盘类型 - 硬盘使用知识大全(2)

    硬盘类型 - 硬盘使用知识大全(2) 前一篇教程,对硬盘做了简要的介绍,本文继续,重点介绍硬盘的种类. 硬盘类型 从使用的角度来说,硬盘分台式机硬盘.笔记本硬盘.移动硬盘.机械硬盘.固态硬盘.服务器硬 ...

  2. Web测试知识大全-整理

    Web测试知识大全 Web测试知识大全 1 分类及测试要点 6 1.1.功能测试 6 1.1.1. 测试方面 6 1.1.2. 测试点 8 1.2.性能测试 9 1.2.1. 工具 9 1.2.2 分 ...

  3. java(5)---Java基础知识大全

    Java基础知识大全 一.基础知识:  1.JVM.JRE和JDK的区别:  JVM(Java Virtual Machine):java虚拟机,用于保证java的跨平台的特性.  java语言是跨平 ...

  4. MTK 驱动(4)---MTK Android Driver知识大全

    MTK Android Driver知识大全 一.Display 1.lcm 相关概念 1.1) MIPI接口:一共有三种接口:DBI(也做CPU或MCU接口).DPI(也叫RGB接口).DSI. 在 ...

  5. 查找元器件_电子元器件-常用电子元器件基础知识大全

    电子元器件-常用电子元器件基础知识大全 一.电阻器(R) 简称电阻,是指具有一定技术性能的在电路中专起电阻作用的元件,可用来调节电路中的电流和电压,或者作为电路中的负载.1.电阻的参数: a. 阻值: ...

  6. 计算机硬件知识硬盘,DIY硬件知识:小白必看的硬盘基础知识大全

    硬盘是DIY硬件最为重要的存储设备,如果没有硬盘,虽然能够点亮机器,但是你不能进入系统并且保存任何资料文件.众所周知,目前主流的硬盘类型有两种,一种为机械硬盘,另一种为固态硬盘,固态硬盘是目前最流行的 ...

  7. C语言基础知识入门和C语言入门基础知识大全

    一.C语言基础知识入门 C语言一出现,就以其丰富的功能.强大的表达能力.灵活性.方便性和广泛的应用,在世界范围内迅速普及和普及.C语言不仅高效而且可移植.它可以用来开发应用软件.驱动程序.操作系统等. ...

  8. 健康知识大全api 取得最新的知识列表

    健康知识大全api,最新健康知识,通过当前最新的ID,取得最新的知识列表.通过该方法可以做到数据的不重复! 接口名称:健康知识大全api 接口平台:开源接口 接口地址:http://japi.juhe ...

  9. 硬盘知识大全(含主板、BIOS)

    硬盘知识大全(含主板.BIOS) 2011年03月15日 2 楼........"硬盘各部位常见故障汇总" ※ "已报废硬盘修复记." 3 楼........& ...

最新文章

  1. 10G_Ethernet_04 10G Ethernet Subsystem IP 的快速验证(万兆以太网IP的快速验证)
  2. iOS vs. Android,应用设计该如何对症下药?
  3. 听说你想爬点壁(mei)纸图
  4. 【BZOJ4035】数组游戏,博弈论+分块乱搞
  5. xadmin获取mysql_Django+Xadmin构建项目的方法步骤
  6. linux 下Eclipse for C/C++的不常见设置
  7. transform 动画效果
  8. 技巧:linux开机自动启动脚本(转)
  9. fireworks CS6安装教程
  10. 网页音乐制作器(网页钢琴)-- MusicMaker
  11. 不知明镜里,何处得秋霜
  12. ntext字段的替换处理示例--全表替换
  13. 服务器怎么装虚拟打印机,虚拟打印机安装不成功的原因
  14. python expect模块pexpect简单应用
  15. vs2017支持所有版本VC
  16. 小虎电商浏览器:至尊宝拼多多一件代发应该如何操作
  17. Panoply地理网格绘制软件
  18. 【哈佛学习力6:学习生活化】
  19. 如何在Mac上的Pages文稿中升高和降低字符和文本?
  20. 基于matlab的磁悬浮控制系统,基于MATLAB的磁悬浮控制系统研究

热门文章

  1. CopyOnWriteArrayList源码解析
  2. 大话设计模式Python实现-观察者模式
  3. conductor任务域
  4. 建议大家使用Java 8 的日期、时间,而非java.util.Date
  5. 对于《软件工程》课程的认识
  6. web项目的两个创建形式website和webapplication
  7. 英文简历的几种常见形式
  8. django form choice
  9. java 泛型详解-绝对是对泛型方法讲解
  10. MyBatis基础:MyBatis关联查询(4)