1、querySelector只返回匹配的第一个元素，如果没有匹配项，返回null。 
2、querySelectorAll返回匹配的元素集合，如果没有匹配项，返回空的nodelist(节点数组)。 可通过指定下标的方法获取某个的元素，例如document.querySelectorAll('.ubox')[0]，表示获取第一个。
返回的结果是静态的，之后对document结构的改变不会影响到之前取到的结果。 
这两个方法都可以接受三种类型的参数：id(#)，class(.)，标签，很像jquery的选择器。
 
3、getElementsByTagName() 方法可返回带有指定标签名的对象的集合。document.getElementsByTagName("p")[3]获取指定元素。
4、getElementById()返回指定的元素。
 

js 原生 document.querySelectorAll document.getElementsByTagName document.querySelector document.getElementById的区别的更多相关文章

  1. document.querySelectorAll() 兼容 IE6

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

  2. [label][转载][JavaSript]querySelectorAll 方法相比 getElementsBy 系列方法有什么区别？

     轉載出處: http://www.zhihu.com/question/24702250 querySelectorAll 相比下面这些方法有什么区别? getElementsByTagName g ...

  3. JavaScript中querySelector()和getElementById()（getXXXByXX）的区别

    在日常开发中,使用JavaScript获取元素的时候,最常用的方法就是document.getElementById(getXXXByXX)方法.但是最近发现有很多地方使用的是querySelecto ...

  4. querySelectorAll 方法相比 getElementsBy 系列方法有什么区别

    感谢 http://www.zhihu.com/question/24702250 简生 的回答 1. W3C 标准 querySelectorAll 属于 W3C 中的 Selectors API ...

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

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

  6. document.querySelector()和document.querySelectorAll()

    HTML5向Web API新引入了 document.querySelector()和document.querySelectorAll()两个方法,都可以接收三种类型的参数:id(#),class( ...

  7. document.querySelector()与document.querySelectorAll()

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

  8. JS - 把类似document.querySelectorAll(".xxx")、document.getElementsByName("xxx")这种方法的返回结果转换成数组对象

    var btns = document.querySelectorAll(".btn");console.log(btns instanceof Array); // falseb ...

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

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

随机推荐

  1. codeforces 848A - From Y to Y(构造)

    原题链接:http://codeforces.com/problemset/problem/848/A 题意:让我们构造一个字符串.这里有一种操作:取走这个字符串的若干部分,分成两部分,然后将这两部分 ...

  2. HashMap存取原理之JDK8

    前言 哈希表(hash table)也叫散列表,是一种非常重要的数据结构 应用场景之一:缓存技术(比如memcached的核心其实就是在内存中维护一张大的哈希表) 目录 一.哈希表 二.hashmap ...

  3. 初识 ❤ TensorFlow |【一见倾心】

    说明

  4. 术语-MOSS-微软协作工具：MOSS（微软协作工具）

    ylbtech-术语-MOSS-微软协作工具:MOSS(微软协作工具) MOSS -- Microsoft Office Sharepoint Server,是一款为企业客户而设计的.基于web的内容 ...

  5. jmeter添加自定义扩展函数之DoubleSum

    1,打开eclipse,新建maven工程,在pom中引用jmeter核心jar包,具体请看---https://www.cnblogs.com/guanyf/p/10863033.html---,这 ...

  6. oo前三次作业博客总结

    第一次作业 实现多项式的加减运算,主要问题是解决输入格式的判断问题. 输入实例: {(3,0), (2,2), (12,3)} + {(3,1), (-5,3)} – {(-199,2), (29,3 ...

  7. shell zip和unzip压缩和解压，压缩效率

    1.把/home目录下面的mydata目录压缩为mydata.zip zip -r mydata.zip mydata #压缩mydata目录zip -r mydata.zip ./*txt #压缩当 ...

  8. scrapy爬虫值Items

    Items有哪些知识? 1.声明 import scrapy class Product(scrapy.Item): name = scrapy.Field() price = scrapy.Fiel ...

  9. centos 7 设置开机启动脚本

    vi /etc/rc.d/rc.local 在末尾追加 sh脚本 sh脚本要提前赋予执行权限 下面是测试,开机同步北京时间 [root@commonTest bin]# vi /usr/local/b ...

  10. Scala中下划线的总结

    1. 方法转化为函数 2. 集合中的每一个元素 3. 获取元组Tuple中的元素 4. 模式匹配 5. 队列 6. 导包引入的时候 7. 初始化变量 引用自:https://blog.csdn.net ...