NodeList对象

是DOM操作取出的集合(实际上是基于DOM结构动态查询的结果),用来保存一组有序的节点,可以通过位置来访问这些节点,它并不是array的实例。

Nodelist最大的特点就是它的时效性,DOM结构的变化能自动反映在Node List对象中。也就是说当DOM结构发生变化时,NodeList立刻会发生变化。

NodeList对象转为数组方法:

Array.prototype.slice.call(someNode.childNodes, 0) 或 [].slice(someNode.childNodes, 0)

由于IE8及更早版本不支持该方法,所以要使用手动枚举:

function covertToArray(nodes){
var array = null;
try{
array = Array.prototype.slice.call(nodes, 0);//非IE浏览器
}catch{
array = new Array();
for(var i, len = nodes.length; i<len; i++){
array.push(nodes[i]);
}
}
return array; }

javaScript之NodeList的更多相关文章

  1. 在javascript中NodeList和Array的区别及转换方法

    随着深入理解javascript 后对于一些小知识的了解慢慢加深,这里说的是关于nodelist和array的区别,相信你一定用过toarray()方法,但是这里通过js 的方法讲解nodelist ...

  2. 深入理解javascript中的动态集合——NodeList、HTMLCollection和NamedNodeMap

    × 目录 [1]NodeList [2]HTMLCollection [3]NamedNodeMap[4]注意事项 前面的话 一说起动态集合,多数人可能都有所了解.但是,如果再深入些,有哪些动态集合, ...

  3. JavaScript NodeList和Array

    原文引用脚本之家作者:Jeff Wong,谢谢大神提供资源 在Web前端编程中,我们通常会通过document.getElementsByTagName或者document.getElementsBy ...

  4. javascript高级程序设计---NodeList和HTMLCollection

    节点对象都是单个节点,但是有时会需要一种数据结构,能够容纳多个节点.DOM提供两种接口,用于部署这种节点的集合分别是NodeList和HTMLCollection MDN上的定义: NodeList: ...

  5. jQuery学习之路(7)- 用原生JavaScript实现jQuery的某些简单功能

    ▓▓▓▓▓▓ 大致介绍 学习了妙味,用原生的JavaScript实现jQuery中的某些部分功能 定义自己的函数库lQuery ▓▓▓▓▓▓ $()选择器的实现 jQuery是面向对象的,所以自己编写 ...

  6. JavaScript

    2015-08-01 16:20 JavaScript使用时需要注意的地方 1.引入JS的位置:最好的做法是把<script>的标签放到HTML文档的最后.</body>标签之 ...

  7. Javascript实践技巧

    最近辞职了,准备北上.期待有个好结果~   本文以<Javascript高级程序设计>为基础,结合自身经验来总结下Javascript实际工作方面的知识.   一.可维护性 1.代码约定 ...

  8. 《高性能javascript》一书要点和延伸(上)

    前些天收到了HTML5中国送来的<高性能javascript>一书,便打算将其做为假期消遣,顺便也写篇文章记录下书中一些要点. 个人觉得本书很值得中低级别的前端朋友阅读,会有很多意想不到的 ...

  9. JavaScript权威设计--JavaScript脚本化文档Document与CSS(简要学习笔记十五)

    1.Document与Element和TEXT是Node的子类. Document:树形的根部节点 Element:HTML元素的节点 TEXT:文本节点   >>HtmlElement与 ...

随机推荐

  1. Spring Cloud实战微服务入门

    1.spring cloud是什么? 是一个快速构建分布式系统的工具集,构建于Spring Boot之上 2.spring cloud 的特点 约定优于配置 开箱即用.快速启动 适用于各种环境 轻量级 ...

  2. 计算机网络【六】:传输层-TCP概述 【转】

    转自:http://blog.chinaunix.net/uid-26275986-id-4109209.html 根据TCP/IP协议的分层结构,网络层之上是传输层,从层次结构上来看,传输层位于网络 ...

  3. hdoj-1038-Biker's Trip Odometer(水题)

    题目真的考验英语 题目链接 需要进行单位的转换 对于Pi用:3.1415927. 5280步相当于1英里. 12英寸相当于1步. 60分钟等于1小时 60秒等于1分钟. 201.168米等于1弗朗.( ...

  4. 【SQL查询】查询的值为空时,给出默认值_NVL函数

    格式为: NVL( string1, replace_with) 功能:如果string1为NULL,则NVL函数返回replace_with的值,否则返回string1的值. 引申一下,此NVL的作 ...

  5. hdu5087 Revenge of LIS II (dp)

    只要理解了LIS,这道题稍微搞一下就行了. 求LIS(最长上升子序列)有两种方法: 1.O(n^2)的算法:设dp[i]为以a[i]结尾的最长上升子序列的长度.dp[i]最少也得是1,就初始化为1,则 ...

  6. Memcache mutex设计模式

    Memcache mutex设计模式 转自:https://timyang.net/programming/memcache-mutex/ 场景 Mutex主要用于有大量并发访问并存在cache过期的 ...

  7. Agc007_C Pushing Balls

    传送门 题目大意 在一条直线上有$N$个球和$N+1$个洞,每两个球之间有一个洞,每两个洞之间有一个球,最左端和最右端都是洞,其中产生的$2N$个间隔满足从左到右是等差数列.你每次随机选择一个未被推进 ...

  8. Python 2.7_利用xpath语法爬取豆瓣图书top250信息_20170129

    大年初二,忙完家里一些事,顺带有人交流爬取豆瓣图书top250 1.构造urls列表 urls=['https://book.douban.com/top250?start={}'.format(st ...

  9. C#异步编程(三)内核模式线程同步

    其实,在开发过程中,无论是用户模式的同步构造还是内核模式,都应该尽量避免.因为线程同步都会造成阻塞,这就影响了我们的并发量,也影响整个应用的效率.不过有些情况,我们不得不进行线程同步. 内核模式 wi ...

  10. webpack 插件

    插件可以完成更多 loader 不能完成的功能. 插件的使用一般是在 webpack 的配置信息 plugins 选项中指定. Webpack 本身内置了一些常用的插件,还可以通过 npm 安装第三方 ...