querySelector()接受一个CSS选择符，返回匹配的第一个元素，反之则NULL。

如：

　　var body = document.querySelector('body');

　　var mydiv = document.querySelector('#mydiv');

　　var myclass = document.querySelector('.selected');

以上三个用来代替getElementById()和getElementByTagName().

其次如果要限定范围查找  则可以

　　var img = document.body.querySelector('img.button');

相对于querySelectorAll(); 则是取得一个NodeList

js之querySelector方法的更多相关文章

  1. 异步加载js文件的方法

    # 异步加载js文件 - js的加载默认是同步的,因为js是单线程执行,只能完成一件再执行下一件. - 一些外部引入的js文件可以因为文件太大,在加载资源的过程中会影响dom元素的加载,影响了用户体验 ...

  2. JS选择器querySelector和~All，三个原生选择器

    定义: querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素. 注意: querySelector() 方法仅仅返回匹配指定选择器的第一个元素.如果你需要返回所有的元素,请 ...

  3. 自动化测试中，元素无法点击定位等问题的解决：js的使用方法

    在自动化测试中经常会遇到使用selenium方法定位元素点击操作失败的情况,例如,我们想实现在浏览器输入http://www.baidu.com,进入百度首页后,鼠标悬停在“更多产品”上,点击“全部产 ...

  4. TODO：Node.js pm2使用方法

    TODO:Node.js pm2使用方法 pm2 是一个带有负载均衡功能的Node应用的进程管理器. 当你要把你的独立代码利用全部的服务器上的所有CPU,并保证进程永远都活着,0秒的重载, PM2是完 ...

  5. 【转载】JS中bind方法与函数柯里化

    原生bind方法 不同于jQuery中的bind方法只是简单的绑定事件函数,原生js中bind()方法略复杂,该方法上在ES5中被引入,大概就是IE9+等现代浏览器都支持了(有关ES5各项特性的支持情 ...

  6. 前端Js跨域方法汇总—剪不断，理还乱，是跨域

    1.通过jsonp跨域2.通过修改document.domain来跨子域(iframe)3.隐藏的iframe+window.name跨域4.iframe+跨文档消息传递(XDM)5.跨域资源共享 C ...

  7. 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别

    一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...

  8. JS调用OC方法并传值，OC调用JS方法并传值////////////////////////zz

     iOS开发-基于原生JS与OC方法互相调用并传值(附HTML代码)     最近项目里面有有个商品活动界面,要与web端传值,将用户在网页点击的商品id 传给客户端,也就是js交互,其实再说明白一点 ...

  9. 原生JS中apply()方法的一个值得注意的用法

    今天在学习vue.js的render时,遇到需要重复构造多个同类型对象的问题,在这里发现原生JS中apply()方法的一个特殊的用法: var ary = Array.apply(null, { &q ...

随机推荐

  1. .net unicode汉字互相转换

    [两种方法].net unicode汉字互相转换 ========================================= //汉字转Unicode编码(ASCII) private str ...

  2. Django与缓存

    我们都知道Django建立的是动态网站,正常情况下,每次请求过来都经历了这样一个过程: 接收请求 -> url路由 -> 视图处理 -> 数据库读写 -> 视图处理 -> ...

  3. vue中 父子组件的通讯

    1.父组件可以使用 props 把数据传给子组件. 2.子组件可以使用 $emit 触发父组件的自定义事件 实例: 父组件: layout.vue  子组件:logform.vue 子组件: < ...

  4. Codeforces 1053 B - Vasya and Good Sequences

    B - Vasya and Good Sequences 思路: 满足异或值为0的区间,必须满足一下条件: 1.区间中二进制1的个数和为偶数个; 2.区间二进制1的个数最大值的两倍不超过区间和. 如果 ...

  5. Codeforces 841 D - Leha and another game about graph

    D - Leha and another game about graph 思路:首先,如果所有点的度数加起来是奇数,且没有-1,那么是不可以的. 其他情况都可以构造,我们先dfs出一个生成树,然后从 ...

  6. ThinkPHP执行原生的SQL语句

    执行原生的SQL语句: $sql="insert select update delete...."; ①查询语句:   $model对象 -> query($sql);  ...

  7. Kaggle泰坦尼克数据科学解决方案

    原文地址如下: https://www.kaggle.com/startupsci/titanic-data-science-solutions --------------------------- ...

  8. 最新的vueWebpack项目

    最近优化了我的vueWebpack多入口框架,感觉清新了好多:http://pan.baidu.com/s/1bNYJp0

  9. es的mapping设置

    自定义mapping的api PUT test_index { "mappings": { #mappings关键字 "doc": { #type " ...

  10. prune研究记录(二)

    发现之前自己写的程序里面的一个bug,就是关于再函数中改变全局变量的事情,有两个函数,在一个函数中定义了一个全局变量并进行了赋值操作,但是在后面的函数中没有申明全局变量,所以后面这个函数本来是想要改变 ...