原生JS实现循环Nodelist Dom列表的4种方式示例
GPT4.0+Midjourney绘画+国内大模型 会员永久免费使用!
【 如果你想靠AI翻身,你先需要一个靠谱的工具! 】
本文实例讲述了原生JS实现循环Nodelist Dom列表的4种方式。分享给大家供大家参考,具体如下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | 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数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。
微信公众号搜索 “ 脚本之家 ” ,选择关注
程序猿的那些事、送书等活动等着你
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若内容造成侵权/违法违规/事实不符,请将相关资料发送至 reterry123@163.com 进行投诉反馈,一经查实,立即处理!
最新评论