- 浏览: 2560896 次
- 性别:
- 来自: 北京
文章分类
- 全部博客 (1286)
- js-oop (2)
- js-window (10)
- js-event (19)
- js-string (37)
- js-array (27)
- js-page (4)
- js-dom (62)
- js-lang (8)
- js-number (7)
- js-platform (3)
- js-object (15)
- js-element (3)
- js-browser (7)
- js-url (6)
- js-date (10)
- css基础 (48)
- css优化 (15)
- html基础 (17)
- html标签 (19)
- js基础 (117)
- js-兼容性差异 (33)
- js引擎 (3)
- js性能 (14)
- json (6)
- jQuery源码浅析 (43)
- web mobile开发资料 (78)
- js跨域 (2)
- html5 (74)
- html5-canvas (7)
- css3 (53)
- 浏览器 (5)
- api设计学 (3)
- js-加载 (3)
- linux (37)
- 架构师 (1)
- php (2)
- self开发的脚本库--凤凰 (2)
- web应用名词 (6)
- javascript新特性翻译 (8)
- ajax (6)
- jQuery动画效果 (7)
- prototype的解读 (13)
- 优秀插件翻译 (1)
- css解决方案 (26)
- 数据库 (2)
- english daily (59)
- 浏览器内核探究 (1)
- jQuery插件介绍 (9)
- jquery基础篇 (26)
- chrome浏览器问题整理 (14)
- js选择器那些事 (3)
- 前端框架 (26)
- Firefox私有属性 (11)
- webkit私有属性集合 (17)
- 书籍推荐 (21)
- 数据结构 (1)
- 网站建设相关 (7)
- 好文翻译 (2)
- 个人作品 (3)
- kissy的解读 (4)
- css-layout(布局研究) (5)
- less研究 (1)
- YUI探究 (1)
- hash探究 (1)
- js动画 (7)
- 前端面试题 (37)
- css书写规范 (1)
- js模板引擎 (6)
- js模块化 (19)
- 编写高质量代码 (3)
- 性能探究--应用协议 (2)
- 前端图像处理 (19)
- Mac OS相关 (21)
- 正则表达式 (11)
- 离线应用相关 (0)
- 前端工具 (65)
- nodeJS (55)
- jquery优化篇 (2)
- 设计模式探究系列 (3)
- windows7 (2)
- IE10 (10)
- 微博开放平台探究 (2)
- 常用web服务接口 (1)
- 数据存储相关 (8)
- 零时文件 (2)
- jQuery Mobile (16)
- backbone (15)
- underscore (22)
- sass (11)
- android (3)
- phonegap (10)
- IE私有 (11)
- qwrap (8)
- git (14)
- chrome extensions (5)
- freemarker (11)
- angularJS (3)
- seo (2)
- markdown (3)
- css动画 (4)
- 安卓开发 (2)
- React (7)
- 活动页技术 (1)
- 网络安全 (3)
- grunt (7)
- Lo-Dash (3)
- 前端国际化 (4)
- 版本控制 (2)
- 盒模型 (4)
- 微信开发 (1)
- Mock数据工具 (1)
- sails (1)
- vim (1)
- js-color (1)
- iOS 基础 (43)
最新评论
-
jertom:
<div id="showInfo" ...
addEventListener等事件监听的参数细谈 -
乌托邦国王:
引用[u][/u]
css3动画属性系列之transform细讲移动translate -
hvang1988:
能提供附件下载吗,找不到js库,google封了访问不了
Syntaxhighlighter---代码高亮插件介绍 -
sscsacdsadcsd:
我的天 那到底是为什么function是object我看und ...
typeof func ==='function'的疑惑 -
wkjiangwk:
试了,没用,你们从不去测试。
介绍一下x-webkit-speech -------实现语音输入
querySelector 和 querySelectorAll
- 是W3C Selectors API Level 1 规范中定义的
- 作用是根据CSS选择器规范,定位文档中指定的元素
- IE8及以上版本,FF,Chrome,Safari,Opera等都支持
任何NodeList,Element的实例对象和Document DocumentFragment的实例对象都有这两个方法。
- querySelectorAll 返回的是符合条件的所有节点内容,是一个NodeList | 如果没有返回空数组
- querySelector仅返回符合条件的第一个节点内容,是一个Node | 如果没有返回null
代码举例:
<div id="header"> <div class="container relative"> <a class="logo absolute"> <img src="img/logo.png" alt="logo"/> </a> </div> </div>
获取header
var document = doc; doc.querySelector('#header'); doc.querySelectorAll('#header')[0];
注意:
规范规定里面的参数---选择器是针对当前文档
扩展阅读:
发表评论
-
动态创建style并写入
2013-08-06 11:35 0动态创建style标签,并写入内容: ... -
array中最后一个空元素的差异
2013-06-05 16:53 1410本文来自w3help的一篇《SJ2007: ... -
History全兼容方案之ie6-7
2013-05-08 16:01 1571在IE6-7中无法使用hash来产生历史记录 ... -
new Date返回值的差异
2013-01-04 11:37 2030//返回当前的时间 new Date(); ... -
IE下加载flash相关
2012-12-17 10:21 1346case: IE在加载flash的时候,需要对Obj ... -
IE下删除自定义属性的兼容性问题
2012-12-17 10:02 2809很多时候我们会给某个dom元素赋予一些自定义的属 ... -
原生DOM获取元素相关的api
2012-12-10 14:19 1557整理一下底层获取元素相关的方法: getE ... -
获取flash对象
2012-12-03 15:06 1639场景:获取swf对象 先上一张图: 来自 ... -
关于cssText的差异
2012-10-10 19:56 2152其实很多人应该接触过cssText这个style对象的属性。 ... -
getAttribute和setAttribute设置style的兼容问题
2012-10-10 19:25 3060其实前面写过一篇“获取和设置目标元素的属性值”的,本文补充说明 ... -
关于script标签的onerror事件
2012-10-01 01:56 7940其实写过jsonp相关api或者了解jsonp原理的同学其实都 ... -
获取head元素
2012-09-17 15:21 1843先上一段jquery 1.7.1版本的代码片段: ... -
navigator对象获取浏览器语言的兼容性
2012-09-09 20:37 2303关于navigator对象中与语言相关的属性直接的差异 ... -
document.uniqueID
2012-09-07 14:16 2530uniqueID 是IE 私有的只读属性 ... -
关于textarea下空格和回车
2012-08-07 18:10 19981、关于textarea下的回车: IE下:\r ... -
iframe相关case之allowTransparency属性
2012-07-27 12:47 17811、在使用iframe调用的页面,IE(不包含ie9)会以白 ... -
关于window.close()各大浏览器兼容的解决方案
2012-06-16 16:39 15516前言: 很多人可能没有关注过window. ... -
关于动态修改script标签的src的值引发的一些思考
2012-05-10 16:07 7212前言: 最近在逛各家UED博客的时候,在w3ctech ... -
DOM-hasAttribute方法
2012-05-06 17:30 1694DOM hasAttribute()方法 ... -
获取页面编码
2012-05-03 19:44 1327简单记录,个人学习 document.char ...
相关推荐
他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素。 目前几乎主流浏览器均支持了他们。包括 IE8(含) 以上版本、 Firefox、 Chrome、Safari、Opera。 querySelector 和 querySelectorAll 在规范中定义了如下...
querySelector和querySelectorAll是W3C提供的新的查询接口 querySelector和querySelectorAll是W3C提供的 新的查询接口,...这两个方法都可以接受三种类型的参数:id(#),class(.),标签,很像jquery的选择器。 var obj
一开始很多人都会拿jquery的选择器来跟这两个api做对比(我也是),比较异同本来没事,但却使一些同学对这两个api在浏览器中的实现产生了误解,特别是再dom element上调用此api时。 下面是我的jsFiddle示例,我就...
一开始很多人都会拿jquery的选择器来跟这两个api做对比(我也是),比较异同本来没事,但却使一些同学对这两个api在浏览器中的实现产生了误解,特别是再dom element上调用此api时。 下面是我的jsFiddle示例,我就...
事实上,现在所有的浏览器厂商都提供了 querySelector 和 querySelectorAll 这两个方法的支持,甚至就连微软也派出了 IE 8 作为支持这一特性的代表,querySelector 和 querySelectorAll 作为查找 DOM 的又一途径,极...
在IE8的新特性里,提到了会支持querySelector()和querySelectorAll()方法,如何使用这里就不说了,只是记录下我在使用时遇到一个问题。
HTML5向Web API新引入了document.querySelector以及document.querySelectorAll两个方法用来更方便地从DOM选取元素,功能类似于jQuery的选择器。这使得在编写原生JavaScript代码时方便了许多。 用法 两个方法使用...
querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素。 注意: querySelector() 方法仅仅返回匹配指定选择器的第一个元素。如果你需要返回所有的元素,请使用 querySelectorAll() 方法替代。 浏览器支持 ...
实用程序与当量querySelector , querySelectorAll ,和matches 。 DOM和hast之间的显着区别是DOM节点引用了其父节点,这意味着可以对document.body.matches(':last-child')进行评估。 此信息不会存储在hast中,...
本文实例讲述了高效jQuery选择器的5个技巧。分享给大家供大家参考,具体如下: 顾名思义,jQuery专注于查询(queries)。库的核心允许你使用CSS选择器语法,以及通过在集合上执行函数,来查找DOM元素。 jQuery使用...
分别对应的 querySelector、 querySelectorAll 与 matches (暂时浏览器还不支持) 1.1 nes.one(selector[, context]) 返回 __第一个__匹配selector(在context的subtree中)的元素 1.2 nes.all(selector[, context]) ...
实用程序与等价物querySelector , querySelectorAll ,和matches 。 请注意,DOM引用了其父节点,这意味着可以对document.body.matches(':last-child')进行评估。 此信息不会存储在unist中,因此类似的选择器不起...
选择器匹配选择器与中的节点匹配。 更具体地说,它们与DOMNode匹配,该DOMNode提供了对特定实现的抽象。 该库提供了W3CNode ,它包装了org.w3c.dom.Node ,但是您始终可以自己滚动。 对于简单的一次关闭选择器匹配,...
jQuery最强大的功能在于它可以通过css选择器查找元素,它的源码中有一半是sizzle css选择器引擎的代码,在html5规范出来之后,增加了document.querySelector和document.querySelectorAll直接查找元素,如果是做...
ElementPresence V1.0 ... 作为参数,您可以使用通常与querySelector和querySelectorAll一起使用的任何有效选择器。 elementPresence('.element-class').then( ( element ) => { myOtherFunction() });
dom选择器是一个超轻量级纯选择器, 兼容到IE5, 用法和document.querySelectorAll几乎一样. 此dom选择器超轻量, 未压缩100+行, 压缩之后3KB 如果浏览器支持document.querySelectorAll方法且查询语句正确, 则此选择器...
如果不将选择器引擎插入其中,则默认为querySelector / querySelectorAll。 有关更多信息,请参见 。 安装 $ npm install --save microdata 原料药 微数据(模式,元素) 查找具有给定itemtype的所有元素,提取...
您的函数应返回与 CSS 选择器匹配的 DOM 元素数组。 将对您的函数进行以下调用: $("div") - 应该返回 2 个 DIV $("img.some_class") - 应该返回 1 IMG $("#some_id") - 应该返回 1 DIV $(".some_class") - ...