这个区别我估计大神都不知道,问题源于博主,细节被一个妹子发现的

事情经过是这样

  1. <ul>
  2. <li>item</li>
  3. <li></li>
  4. <li></li>
  5. <li>item</li>
  6. <li>item</li>
  7. </ul>

第一阶段

  1. //本人折腾了一个循环
  2. var alis = document.getElementTagName('li')
  3. for(var i = 0 ;i < alis.length ; i++ ){
  4. if(alis[i].innerHtml ==""){
  5. alis[i].parentNode.removeChild( alis[i] )
  6. }
  7. }
  • 一眼看上,呢吗还用想码,------一个大大的 3
  • 答案一运行结果页面出现四个 li
  1. 这是为什么呢---因为每次for循环alis.length 是一个动态:这一点很多人都知道
  2. 只不过第一眼看过忽略了。所以心里稳妥妥的---答案立马变成了4

第二阶段:事情的高潮阶段

  1. 本人以高心,就开始四处扩散谣言,结果这时妹子,写了个demo,一巴掌大我脸上
  2. -- 蒸腾
  1. var alis = document.querySelectorAll('li')
  2. for(var i = 0 ;i < alis.length ; i++ ){
  3. if(alis[i].innerHtml ==""){
  4. alis[i].parentNode.removeChild( alis[i] )
  5. }
  6. }
  7. //直接上结果了-----3

第三阶段:我瞬间林乱了,这时什么鬼

  • 。。。。。。。 一万只神兽飞过。。。。。。。

本剧终

  • querySelectorAll 得到是一个数组 -nodelist

  • getElementTagName得到是一个伪数组 --dom的结合

  • 至于以上为什么会有区别;这锅只能丢给规范---一句话规范如此

  • 虽然被大脸,不过这波姿势长的好,求天天打脸

document.querySelectorAll() 与document.getElementTagName() 的区别的更多相关文章

  1. HTML5中类jQuery选择器querySelector的高级使用 document.querySelectorAll.bind(document);

    基本用法 querySelector 该方法返回满足条件的单个元素.按照深度优先和先序遍历的原则使用参数提供的CSS选择器在DOM进行查找,返回第一个满足条件的元素. ----> querySe ...

  2. document.querySelectorAll() 兼容 IE6

    不多说,直接上代码 // 使用 css 选择器获取元素对象 兼容性封装 Test Already. function getElementsByCss(cssStr){ if(document.que ...

  3. js 原生 document.querySelectorAll document.getElementsByTagName document.querySelector document.getElementById的区别

    1.querySelector只返回匹配的第一个元素,如果没有匹配项,返回null.  2.querySelectorAll返回匹配的元素集合,如果没有匹配项,返回空的nodelist(节点数组). ...

  4. document.getElementById和document.querySelector的区别

    zepto中的$(".111")出错,jQuery中$(".111")不出错的原因: zepto用document.querySelector实现,jQuery ...

  5. document.querySelector()与document.querySelectorAll()

      document.querySelector()与document.querySelectorAll() CreationTime--2018年7月1日10点49分 Author:Marydon ...

  6. 谈谈document.ready和window.onload的区别

    在Jquery里面,我们可以看到两种写法:$(function(){}) 和$(document).ready(function(){}) 这两个方法的效果都是一样的,都是在dom文档树加载完之后执行 ...

  7. Array.prototype.slice.call(document.querySelectorAll('a'), 0)

    Array.prototype.slice.call(document.querySelectorAll('a'), 0)的作用就是将一个DOM NodeList 转换成一个数组. slice()方法 ...

  8. document.body、document.documentElement和window获取视窗大小的区别

    来源:http://www.ido321.com/906.html 在w3school关于window对象的介绍中,介绍了获取浏览器窗口大小的三种方法(浏览器的视口,不包括工具栏和滚动条). 对于In ...

  9. 如何循环遍历document.querySelectorAll()方法返回的结果

    使用JavaScript的forEach方法,我们可以轻松的循环一个数组,但如果你认为document.querySelectorAll()方法返回的应该是个数组,而使用forEach循环它: /* ...

随机推荐

  1. 作为.net程序员学jsp,伤不起

    <%@page import="java.sql.*"%> <%@ page language="java" import="jav ...

  2. HttpGet和HttpPost

    package net.blogjava.mobile; import java.net.HttpURLConnection; import java.util.ArrayList; import j ...

  3. 记一次亲身踩过的hibernate的bug

    记一次亲身踩过的hibernate的bug 在写实体类时,经常会对域增加校验,例如@NotNull表示哪个字段不能为空,昨天晚上调试代码,就遇到了问题, @Entity public class Ap ...

  4. Unity应用架构设计(10)————绕不开的协程和多线程(Part 1)

    在进入本章主题之前,我们必须要了解客户端应用程序都是单线程模型,即只有一个主线程(Main Thread),或者叫做UI线程,即所有的UI控件的创建和操作都是在主线程上完成的.而服务器端应用程序,也就 ...

  5. 小小白的python之路------python基础01

    1. 不说python是啥了,百度一堆.,还是说说我学了啥 我说的是python3.5,其他的自己看着办 这个是下载链接啊,自己玩 https://www.python.org/ 我下载完成,使用py ...

  6. Python使用PyMysql操作数据库

    安装 pip install -U pymysql 连接数据库 连接数据库有两种不同的格式 直接使用参数 代码如下 import pymysql.cursors connection = pymysq ...

  7. java基础(十一章)

    一.理解什么是类和对象               万事万物皆对象 1.属性--对象具有的特征(特点) 2.方法--对象可执行的操作(能干什么事) 3.对象的定义: 是一个客观存在的,看的见或摸得着的 ...

  8. 关于JS跨域问题的解决

    这里不提供什么高深的代码了,只说明一个解决跨域问题的方法,个人觉得这个方法是最方便也是最有效的. 那就是一用不同源的JS,虽然JS不允许不同源的访问,但是可以引用不同源的JS,用这样的方法我们可以引用 ...

  9. iOS,Android,Jave后台AES加密解密

    AES256 在iOS和Android上的相关代码: http://www.tuicool.com/articles/RVFbmmU 里面可以下载相关的代码. 我们遇到的问题是: 把Android的代 ...

  10. pod trunk push --verbose 失败的原因总结

    用 pod trunk push --verbose  添加一个 pod 的时候,经常出现如下的错误 [!] The podspec does not validate. /Library/Ruby/ ...