区分节点列表和HTML集合
来源:互联网 发布:星目读屏软件 编辑:程序博客网 时间:2024/06/05 07:48
:点上面关注免费学习前端知识!
getElementsByName()和getElementsByTagName()都返回NodeList对象,
而类似document.images和document.forms的属性为HTMLCollection对象。
这些对象都是只读的类数组对象。它们有length属性,也可以像真正的数组一样索引(只是读而不是写)。可以对一个NodeList或HTMLCollection的内容用如下标准的循环进行迭代:
for(var i=0;i<document.images.length;i++)//循环所有的图片
document.images[i].style.display="none";//……隐藏它们
不能直接在NodeList和HTML集合上调用Array的方法,但可以间接地使用:
var content=Array.prototype.map.call(document.getElementsByTagName("p"),
function(e){return e.innerHTML;});
HTMLCollection对象也有额外的命名属性,也可以通过数字和字符串来索引。
NodeList和HTMLCollection对象也都能当做函数:以数字或字符串为参数调用它就如同使用数字或字符串索引它们一般。不鼓励使用这种怪异的方式。
NodeList和HTMLCollection接口都不是为像JavaScript这样的动态语言设计的。它们都定义了item()方法,期望输入一个整数,并返回此索引处的元素。JavaScript中根本没有必要调用此方法,因为简单地使用数组索引就能替代。类似地,HTMLCollection定义了namedItem()方法,它返回指定属性名的值,但在JavaScript程序中可以用数组索引或常规属性来访问。
NodeList和HTMLCollection对象不是历史文档状态的一个静态快照,而通常是实时的,并且当文档变化时它们所包含的元素列表能随之改变,这是其中一个最重要和令人惊讶的特性。假设在一个没有<div>元素的文档中调用getElementsByTagName('div'),此时返回值是一个length为0的NodeList对象。如果再在文档中插入一个新的<div>元素,此元素将自动成为NodeList的一个成员,并且它的length属性变成1。通常,NodeList和HTMLCollection的实时性非常有用。但是,如果要在迭代一个NodeList对象时在文档中添加或删除的元素,首先会需要对NodeList对象生成一个静态的副本:
var snapshot=Array.prototype.slice.call(nodelist,0);
完
看前端技术文章,就在Web前端精髓
- 区分节点列表和HTML集合
- children--- 只读属性---子节点列表集合
- 集合和列表
- 集合和列表
- 集合和列表3
- 列表和集合
- html列表和超链接
- HTML表格和列表
- HTML中父节点和子节点
- 区分HTML、XHTML、HTML5和XML
- Collection集合和map集合的种类区分
- Collection集合和map集合的种类区分
- 数组、集合和散列表
- 区分HTML控件、HTML服务器控件和web服务器控件
- html有序列表和无序列表
- HTML 无序列表和有序列表
- 【HTML】-案例-有序列表和无序列表
- HTML 分组无序列表和有序列表
- windows应用程序单实例
- 机器学习基石-05-4-Break Point
- KMP 算法实现
- 自动化测试在测试部门的策略
- 数据序列化avro\thrift\protocol buffer | kyro
- 区分节点列表和HTML集合
- IJ学习笔记
- 11.1,京东的狂欢已经开始了
- PHPExcel中文帮助手册|thinkphp适用3.1.2
- php环境搭建---LAMP
- JUnit与JMock学习-3
- xml基础
- 并发类容器
- ajax FormData上传文件和数据