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. Security基础(四)：OpenSSL及证书服务常用系统监控命令、搭建nagios监控服务器、配置文件及插件使用、监控远程主机的公有数据、监控远程主机的私有数据

    一.OpenSSL及证书服务常用系统监控命令 目标: 本案例要求练习常用的系统监控命令完成以下任务: 使用vmstat命令监控内存及磁盘I/O信息 使用iostat命令监控CPU处理器及磁盘的I/O信 ...

  2. txt操作

    C#解决读写包含汉字的txt文件时乱码的问题 C#解决读写包含汉字的txt文件时乱码的问题 当我们用System.IO.StreamReader读取包含汉字的txt文件时,经常会读出乱码(Stream ...

  3. 配送单MYSQL ,一点都不机智

    这是配送单制作,后面修改了下表 . 写的太乱. 不过也不想去修改了. 放在这里了.反正还能用. 不然就坑爹了. 以后写好一点. 这都是些神马, 太难受了. /* 配送单制作,缺少商品规格,以及库存查询 ...

  4. 安装mysql5.6.24解压版

    第一步:配置环境变量    第二步:修改 my-default.ini 文件  找到mysql 文件夹中的my-default,ini 修改成如下图 如果不修改直接运行cmd  net start m ...

  5. [Flask] 异步非阻塞IO实现

    Flask默认是不支持非阻塞IO的,表现为: 当 请求1未完成之前,请求2是需要等待处理状态,效率非常低. 在flask中非阻塞实现可以由2种: 启用flask多线程机制 # Flask from f ...

  6. python学习笔记：try与except处理异常语句

    写代码的时候会遇到各种各样的异常,那么代码就不会继续往下走了.比如说10除以0是错误的,因为除数不能为零学会捕捉异常,在异常出现的时候我们要做什么操作. 本文中只做简单使用的讲解,详细使用方法可以参考 ...

  7. QTP调用.net Framework类库实例

    1. 日期时间格式处理 set oDate = DotNetFactory.CreateInstance("System.DateTime").Parse("2-18-2 ...

  8. Linux用awk处理文本数据

    awk -F',' -v OFS='\t' 'NR>1{print $1, $4, $6, $7}' demo2.csv | sort -t $'\t' -k 1 -r

  9. Codeforces 1114E(数学+随机算法)

    题面 传送门 分析 通过二分答案,我们显然可以求出数组中最大的数,即等差数列的末项 接着随机取一些数组中的数,对他们两两做差,把得到的差取gcd即为公差 例a={1,5,9,13},我们随机取了1 9 ...

  10. fiddler抓取手机端的数据流量包

    1.首先下载安装fiddler 2.然后打开fiddler,进入到tools-->options-->connections 3.然后进入到https 4.设置完成后,查找本机ip 然后打 ...