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. Angular JS - 3 - Angular JS 双向数据绑定

    一 .数据绑定 1. 数据绑定: 数据从一个地方A转移(传递)到另一个地方B, 而且这个操作由框架来完成2. 双向数据绑定: 数据可以从View(视图层)流向Model(模型,也就是数据), 也可以从 ...

  2. mysql8 主从配置方案

    先理论,后实践!在理论的基础上有指导性的实践会更快,也更容易发现错误.理论参考高性能mysql这本书,之前大概看过一遍,但实际生产中并没有怎么注意mysql性能这方面,今天用到主备,就把第十章的复制拿 ...

  3. Python读取文件时出现UnicodeDecodeError 'gbk' codec can't decode byte 0x80 in position x

    Python在读取文件时 with open('article.txt') as f: # 打开新的文本 text_new = f.read() # 读取文本数据出现错误: UnicodeDecode ...

  4. python中将'12345'转换为12345,不要使用int

    #将'12345'转换为12345,不要使用int s = " #定义一个数字变量 ret = 0 for x in s : ret = ret*10 +( ord(x)-ord(" ...

  5. C++ 指针基址1

    char *p=(char *)&n;中括号中为什幺要加个*号 答: &n是一个整型数值,代表变量n的地址,不包含其所保存的数据的类型信息(也就是说只凭借一个地址是不能推测出,该地址所 ...

  6. identityserver4踩坑总结

    1.在配置id4服务端的时候要注意client里面的 AllowedScopes开放的值要和GetIdentityResources中加入的值是一样的,不然调用以后报{"error" ...

  7. 建站手册-网站建设: Web 标准

    ylbtech-建站手册-网站建设: Web 标准 1.返回顶部 1. http://www.w3school.com.cn/site/site_standards.asp 2. 2.返回顶部 1. ...

  8. 头疼3-4次的问题,数据从DB导出到EXCEL,再从EXCEL导入到DB,数据格式发生错误 ,导致 程序出错。

    反思: 1 解决 问题的思路 绕远了: 在这个问题出现前,程序是运行正确 的 问题出现前,我误删了DB 的 testcase表的所有 case ,然后 再把邮件 中的excel数据导入到 DB 然后 ...

  9. Linux-文件系统概述

    主要对外部存储设备: 分区与格式化原理: IDE: /dev/hda 第一块硬盘 ……/dev/hdn    /dev/hda1 第一块硬盘的第一个分区  第n块IDE硬盘 SCSI:/de/sda ...

  10. Bellman-Ford&&SPFA算法详解

    Dijkstra在正权图上运行速度很快,但是它不能解决有负权的最短路,如下图: Dijkstra运行的结果是(以1为原点):0 2 12 6 14: 但手算的结果,dist[4]的结果显然是5,为什么 ...