document.querySelectorAll() 与document.getElementTagName() 的区别
这个区别我估计大神都不知道,问题源于博主,细节被一个妹子发现的
事情经过是这样
<ul>
<li>item</li>
<li></li>
<li></li>
<li>item</li>
<li>item</li>
</ul>
第一阶段
//本人折腾了一个循环
var alis = document.getElementTagName('li')
for(var i = 0 ;i < alis.length ; i++ ){
if(alis[i].innerHtml ==""){
alis[i].parentNode.removeChild( alis[i] )
}
}
- 一眼看上,呢吗还用想码,------一个大大的 3
- 答案一运行结果页面出现四个 li
这是为什么呢---因为每次for循环alis.length 是一个动态:这一点很多人都知道
只不过第一眼看过忽略了。所以心里稳妥妥的---答案立马变成了4
第二阶段:事情的高潮阶段
本人以高心,就开始四处扩散谣言,结果这时妹子,写了个demo,一巴掌大我脸上
-- 蒸腾
var alis = document.querySelectorAll('li')
for(var i = 0 ;i < alis.length ; i++ ){
if(alis[i].innerHtml ==""){
alis[i].parentNode.removeChild( alis[i] )
}
}
//直接上结果了-----3
第三阶段:我瞬间林乱了,这时什么鬼
- 。。。。。。。 一万只神兽飞过。。。。。。。
本剧终
querySelectorAll 得到是一个数组 -nodelist
getElementTagName得到是一个伪数组 --dom的结合
至于以上为什么会有区别;这锅只能丢给规范---一句话规范如此
虽然被大脸,不过这波姿势长的好,求天天打脸
document.querySelectorAll() 与document.getElementTagName() 的区别的更多相关文章
- HTML5中类jQuery选择器querySelector的高级使用 document.querySelectorAll.bind(document);
基本用法 querySelector 该方法返回满足条件的单个元素.按照深度优先和先序遍历的原则使用参数提供的CSS选择器在DOM进行查找,返回第一个满足条件的元素. ----> querySe ...
- document.querySelectorAll() 兼容 IE6
不多说,直接上代码 // 使用 css 选择器获取元素对象 兼容性封装 Test Already. function getElementsByCss(cssStr){ if(document.que ...
- js 原生 document.querySelectorAll document.getElementsByTagName document.querySelector document.getElementById的区别
1.querySelector只返回匹配的第一个元素,如果没有匹配项,返回null. 2.querySelectorAll返回匹配的元素集合,如果没有匹配项,返回空的nodelist(节点数组). ...
- document.getElementById和document.querySelector的区别
zepto中的$(".111")出错,jQuery中$(".111")不出错的原因: zepto用document.querySelector实现,jQuery ...
- document.querySelector()与document.querySelectorAll()
document.querySelector()与document.querySelectorAll() CreationTime--2018年7月1日10点49分 Author:Marydon ...
- 谈谈document.ready和window.onload的区别
在Jquery里面,我们可以看到两种写法:$(function(){}) 和$(document).ready(function(){}) 这两个方法的效果都是一样的,都是在dom文档树加载完之后执行 ...
- Array.prototype.slice.call(document.querySelectorAll('a'), 0)
Array.prototype.slice.call(document.querySelectorAll('a'), 0)的作用就是将一个DOM NodeList 转换成一个数组. slice()方法 ...
- document.body、document.documentElement和window获取视窗大小的区别
来源:http://www.ido321.com/906.html 在w3school关于window对象的介绍中,介绍了获取浏览器窗口大小的三种方法(浏览器的视口,不包括工具栏和滚动条). 对于In ...
- 如何循环遍历document.querySelectorAll()方法返回的结果
使用JavaScript的forEach方法,我们可以轻松的循环一个数组,但如果你认为document.querySelectorAll()方法返回的应该是个数组,而使用forEach循环它: /* ...
随机推荐
- Word Ladder II 2015年6月4日
Given two words (start and end), and a dictionary, find all shortest transformation sequence(s) from ...
- (入门篇 NettyNIO开发指南)第四章-TIP黏包/拆包问题解决之道
熟悉TCP编程的读者可能都知道,无论是服务端还是客户端,当我们读取或者发送消息的时候,都需要考虑TCP底层的粘包/拆包机制.木章开始我们先简单介绍TCP粘包/拆包的基础知识,然后模拟一个没有考虑TCP ...
- Centos7下安装部署MXNET
Centos下安装MXNET,参考官方文档http://mxnet.io/get_started/setup.html#prerequisites, 一.安装python的mxnet步骤如下: #!/ ...
- 微信小程序封装http访问网络库实例代码
之前都是使用LeanCloud为存储,现在用传统API调用时做如下封装 var HOST = 'http://localhost/lendoo/public/index.php/'; // 网站请求接 ...
- 关于 IDEA 自动识别问题,jsp页面Controller路径自动识别的问题
idea之所以强大,就是强大的代码提示和联想功能,写起代码来简直不要太爽.但是这几天我发现在我的jsp页面中访问controller路径的时候不会自动提示了,对于这么严谨的我肯定要找出原因啊,哈哈. ...
- (原创)用Java实现链表结构对象:单向无环链表
转载请注明本文出处:http://www.cnblogs.com/Starshot/p/6918569.html 链表的结构是由一个一个节点组成的,所谓链,就是每个节点的头尾连在一起.而单向链表就是: ...
- JavaSE教程-03Java中分支语句与四种进制转换
一.分支语句 计算机源于生活,程序模拟现实生活,从而服务生活 行为模式 1,起床,刷牙,洗脸,吃早餐,上课,回家,睡觉(顺序性) 2,如果时间不太够,打个滴滴快车,如果时间够,坐个地铁(选择性) 3, ...
- testlink(以及服务器)问题定位思路
testlink又炸了,记录下问题定位思路: 1.翻阅logs: tail -100f ***.log 2.将关键字百度: 但是狗日的网上一般不会告诉我们这修改的文件在哪(上下图无关联,因为图是后面随 ...
- MyBatis7:MyBatis插件及示例----打印每条SQL语句及其执行时间
Plugins 摘一段来自MyBatis官方文档的文字. MyBatis允许你在某一点拦截已映射语句执行的调用.默认情况下,MyBatis允许使用插件来拦截方法调用 Executor(update.q ...
- final关键字(最终的)
1.fianl关键字可以用来修饰类.属性.方法: 2.final关键字修饰的类不能再继承: 如:String String类是final修饰的类不能被继承 3.final关键字修饰的方法不能被重写 ...