document.querySelector()与document.querySelectorAll()
document.querySelector()与document.querySelectorAll()
CreationTime--2018年7月1日10点49分
Author:Marydon
1.说明
他俩是H5提供的选择器,都可以直接获取页面元素并进行操作。
2.区别
用法与jQuery里的$()选择器相似;
querySelector只能选择第一个匹配的节点;
querySelectorAll可以选择多个节点,返回的是数组形式的页面元素对象。
3.举例
window.onload = function(){
// 获取页面上第一个复选框的值
// 报错
//alert(document.querySelectorAll(':checkbox')[0].value);
// 方式一
alert(document.querySelectorAll('input[type=checkbox]')[0].value);
// 方式二
alert(document.querySelector('input[type=checkbox]').value);
}
相关推荐:
document.querySelector()与document.querySelectorAll()的更多相关文章
- document.querySelector()和document.querySelectorAll()
HTML5向Web API新引入了 document.querySelector()和document.querySelectorAll()两个方法,都可以接收三种类型的参数:id(#),class( ...
- 正确地缩写 document.querySelector
北京的夕阳,伴随淡淡的霾殇.从写字楼望去,光线是那么昏黄.没有孤雁,也没有霞光,遥想当年,还是 jQuery 独霸一方.那时的我们,写程序都习惯了使用 $,至少在对美元符号的喜爱上,与 PHP 达成了 ...
- 实现兼容document.querySelector的方法
var querySelector = function(selector) { //TODO 先简单兼容,后续继续扩展: var element = null; if(document.queryS ...
- document.querySelector和querySelectorAll方法
querySelector和querySelectorAll是W3C提供的新的查询接口,其主要特点如下: 1.querySelector只返回匹配的第一个元素,如果没有匹配项,返回null. 2.q ...
- javascript之 原生document.querySelector和querySelectorAll方法
querySelector和querySelectorAll是W3C提供的新的查询接口,其主要特点如下: 1.querySelector只返回匹配的第一个元素,如果没有匹配项,返回null. 2.q ...
- document.getElementById和document.querySelector的区别
zepto中的$(".111")出错,jQuery中$(".111")不出错的原因: zepto用document.querySelector实现,jQuery ...
- document.getElementById & document.querySelector
document.getElementById & document.querySelector https://developer.mozilla.org/en-US/docs/Web/AP ...
- 关于querySelector 和 document.getElementsByTagName 选中集合问题
本文解决的问题是 :运用for..of..循环时,edge浏览器报Object doesn't support property or method 'symbol.iterator'问题 以及 符号 ...
- document.querySelector获取不到html标签对象实例的原因
官方给出的HTML中的ID的命名规范: 1.必须以字母 A-Z 或 a-z 开头2.其后的字符:字母(A-Za-z).数字(0-9).连字符("-").下划线("_&qu ...
随机推荐
- Autotools Mythbuster
Preface Diego Elio "Flameeyes" Pettenò Author and Publisher <flameeyes@flameeyes.eu> ...
- UVA 10746 Crime Wave - The Sequel
最小费用最大流 源点->警察->bank->汇点 剩下的模板就可以 #include <map> #include <set> #include <li ...
- Java屌炸天学习路线图
第一阶段:Java基础篇 编号 课程 课程目录 打包下载地址 讲师 01 J2SE(40课时) http://www.java1234.com/zy001.html http://pa ...
- 大牛教你如何循序渐进,有效的学习JavaScript?
首先要说明的是,咱现在不是高手,最多还是一个半桶水,算是入了JS的门.谈不上经验,都是一些教训. 这个时候有人要说,“靠,你丫半桶水,凭啥教我们”.您先别急着骂,先听我说! 你叫一个大学生去教小学数学 ...
- 使用keytool生成ssl证书
使用keytool生成ssl证书 在项目中由于要使用https访问项目,然后了解到jdk有一个自带的工具keytool可以用来生成ssl证书,从而可以通过https进行访问. 使用keytool生成s ...
- Codeforces 600E - Lomsat gelral(树上启发式合并)
600E - Lomsat gelral 题意 给出一颗以 1 为根的树,每个点有颜色,如果某个子树上某个颜色出现的次数最多,则认为它在这课子树有支配地位,一颗子树上,可能有多个有支配的地位的颜色,对 ...
- #424 Div2 C
#424 Div2 C 题意 给出 k 个分数,初始分数未知,按顺序把这 k 个分数加到初始分数上,已知 n 个加入分数后的结果(无序),问初始分数有多少种可能. 分析 也就是说这 n 个结果,它们之 ...
- POJ 2441 Arrange the Bulls(状压DP)
[题目链接] http://poj.org/problem?id=2441 [题目大意] 每个人有过个喜欢的篮球场地,但是一个场地只能给一个人, 问所有人都有自己喜欢的场地的方案数. [题解] 状态S ...
- extjs grid合并单元格
http://blog.csdn.net/kunoy/article/details/7829395 /** * Kunoy * 合并单元格 * @param {} grid 要合并单元格的grid对 ...
- easyui combogrid 按需加载,点击下拉加载
功能优点:减少不必要的http请求,减少服务器查询压力,降低额外的浏览器渲染,提高呈现速度开发分享: combogrid 点击才请求的功能实现简要:我分析了费用系统,和现在全网的写法.并不满意.都是要 ...