啥是Document类型
☆ 文档的子节点
Document类型可以表示HTML页面或者其他基于XML的文档。
不过,最常见的应用还是作为HTMLDocument实例的document对象。
通过这个文档对象,
不仅可以取得与页面有关的信息,
而且还能操作页面的外观及其底层结构。
虽然DOM标准规定Document节点的子节点可以是
DocumentType
Element
ProcessingInstruction
Comment
但还有两个内置的访问其子节点的快捷方式。
第一个就是documentElement属性,
该属性始终指向HTML页面中的元素。
另一个就是通过childNodes列表访问文档元素,
但通过documentElement属性则能更快捷、更直接地访问该元素。
作为HTMLDocument的实例,
document对象还有一个body属性,
直接指向元素。
因为开发人员经常要使用这个元素,
所以document.body在JavaScript代码中出现的频率非常高,
☆ 查找元素
说到最常见的DOM应用,
恐怕就要数取得特定的某个或某组元素的引用,
然后再执行一些操作了。
取得元素的操作可以使用document对象的几个方法来完成。
其中,
Document类型为此提供了两个方法:
getElementById()
和getElementsByTagName()。
◇ 第一个方法
第一个方法
getElementById(),接收一个参数:
要取得的元素的ID。
如果找到相应的元素则返回该元素,
如果不存在带有相应ID的元素,
则返回null。
注意,
这里的ID必须与页面中元素的id特性(attribute)严格匹配,
包括大小写。
IE8及较低版本不区分ID的大小写,
因此”myDiv”和”mydiv”会被当作相同的元素ID。
如果页面中多个元素的ID值相同,
getElementById()只返回文档中第一次出现的元素。
IE7及较低版本还为此方法添加了一个有意思的“怪癖”:
【name特性与给定ID匹配的表单元素】也会被该方法返回。
(、、及)
如果有哪个表单元素的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类型相关推荐
- html页面设置document类型,DOM-Document类型
Document类型 JavaScript通过Document类型表示文档.在浏览器中,document对象是HTMLDocument(继承自Document类型)的一个实例,document对象是w ...
- Javascript之DOM(Document类型)
JavaScript通过document类型表示文档.在浏览器中,document对象是HTMLDocument的一个实例,表示整个HTML页面.document对象是window对象的一个属性. D ...
- 什么是document对象?如何获取文档对象上的元素?_javascript自学记录:Document类型...
10.1.2 Document类型 Document类型表示文档,document对象是HTMLDocument的一个实例,document是window对象的一个属性: Document节点的特征: ...
- Document类型知识大全
Document类型 1.文档的子节点 Document类型可以表示HTML页面或者其他基于XML的文档.不过,最常见的应用还是作为HTMLDocument实例的document对象.通过这个文档对象 ...
- 10.1.2 Document类型【JavaScript高级程序设计第三版】
JavaScript 通过Document 类型表示文档.在浏览器中,document 对象是HTMLDocument(继承自Document 类型)的一个实例,表示整个HTML 页面.而且,docu ...
- 第10章 文档对象模型DOM 10.2 Document类型
Document 类型 JavaScript 通过 Document 类型表示文档.在浏览器中, document 对象是 HTMLDocument (继承自 Document 类型)的一个实例,表示 ...
- JS的Document类型
Document HTMLDocument继承自Document. 在浏览器中,document对象是HTMLDocument的一个实例,表示整个HTML页面.document对象是window对象的 ...
- JS学习之Node类型
JS里面一共有12种Node类型.要了解Node类型详细信息可以使用nodeName和nodeValue这两个属性. 比较常用的类型有: 1)Document类型 nodeType为9,node ...
- (JS基础)DOM:节点类型
Node 类型 所有节点类型都继承于 Node 类型,因此所有节点类型都共享这相同的基本属性和方法. 基本属性和方法 nodeName :节点名.对于元素类型,则是元素的标签名(均为大写),如&quo ...
- Node,Document,HTMLDocument,HTMLCollection解析
这里说的是XML的这些对象,而HTML是继承这些对象的,并进行了扩展.如Document对象, Node对象 它是一个节点对象,代表文档树中的一个节点.是所有节点类型的基类 Node对象是整个DOM的 ...
最新文章
- 三峡大学陈迪马:土壤微食物网对全球变化的响应与反馈
- yolo3(目标检测)实测
- (总结)Nginx配置文件nginx.conf中文详解
- linux下生成guid,在Linux下生成GUID的程序,及编译错误 “uuid/uuid.h: No such file or directory” 的解决办法。...
- C++构造函数之委托构造函数
- Mycat分库路由规则
- android如何不自动获取焦点,Android 如何让EditText不自动获取焦点
- 必须掌握的Java基础知识(一)
- pythonista安装tkinter_Python又把GUI界面攻下了,今天就告诉你怎么玩
- paip.图片搜索工具总结
- 推荐几本学习Java的教材
- Python安装和导入cv库
- 纯正体验,极致商务 | 丽亭酒店聚焦未来赛道,实现共赢发展
- 用java下载apk解析包出错_Android 9.0 安装包解析错误 java.lang.SecurityException: Permission Denial解决方案...
- GIS教程之Cesium 基础入门教程
- java对接图灵机器人搭建自己的智能机器人
- Mysql事务-MVCC
- js分页列表找出最后一页的最后一条数据
- 周日:潭杯山-潭柘寺拉练
- 中高级自动化测试工程师技术栈
热门文章
- 07——Vue 中的事件处理 以及 事件修饰符 、键盘事件
- Elasticsearch常用查询命令
- Relatively Prime Graph CodeForces - 1009D
- 找代做java,代做JAVA程序作业、代写学生信息查询系统、代做JAVA实验
- 第十篇:扩展SOUI的控件及绘图对象(ISkinObj)
- VMware Workstation Pro安装
- VMware Workstation的安装
- 计算机定时关机计划任务失败,如何设置定时关机任务?电脑设置定时关机任务方法...
- 初识深度信念网络DBN
- [每日一氵] openCV resize函数直接按比例缩放