本文实例讲述了原生 JS 实现循环 Nodelist Dom 列表的 4 种方式分享给大家供大家参考, 具体如下:
- function $(id) {
- return document.getElementById(id);
- }
- var _PAGE = {
- timeListDom: $('timeList')
- };
- var spanDoms = _PAGE.timeListDom.querySelectorAll('span'), domLen = spanDoms.length;
- // 第一种方式: 原生 for 循环
- for (var i = 0; i < domLen; i++) {
- var v = spanDoms[i];
- // do something you want deal with DOM
- }
- // 第二种方式: Array 的 forEach 函数
- Array.prototype.forEach.call(spanDoms, function(v) {
- // do something you want deal with DOM
- });
- // 第三种方式: Array 的 forEach 函数
- [].forEach.call(spanDoms, function(el) {
- // do something you want deal with DOM
- el.classList.remove('active');
- });
- // 第四种方式: 继承 Array 的 forEach 函数
- NodeList.prototype.forEach = Array.prototype.forEach;
- spanDoms.forEach(function(v) {
- // do something you want deal with DOM
- });
更多关于 JavaScript 相关内容感兴趣的读者可查看本站专题: JavaScript 操作 DOM 技巧总结 JavaScript 错误与调试技巧总结 JavaScript 数据结构与算法技巧总结 JavaScript 遍历算法与技巧总结及 JavaScript 数学运算用法总结
来源: http://www.jb51.net/article/134962.htm