新的选择器
document.querySelector("selector");
selector:根据CSS选择器返回第一个匹配到的元素,如果没有匹配到,则返回null;
支持: Chrome 4.0+, FireFox 3.5+, Safari 3.2+, Opera 10.1+, IE 8+

document.querySelectorAll("selector");
selector:根据CSS选择器返回所有匹配到的元素数组,如果没有匹配到,则返回空数组;
支持: Chrome 4.0+, FireFox 3.5+, Safari 3.2+, Opera 10.1+, IE 8+

 
 
example:
         <div class="oo">HELLO WORD</div>
<div class="oo">this is a test</div>

<script type="text/javascript">

var cc=/*document.querySelector("div")*/document.querySelector(".oo");//返回匹配到的第一个内容

console.log(cc.innerHTML);

var dd=document.querySelectorAll("div");//返回匹配到的所有内容

console.log(dd.length);

for(var i=0;i<dd.length;i++){
console.log(dd.item(i).innerHTML);
}

/*

输出
HELLO WORD
2
HELLO WORD
this is a test
*/
</script>

HTML5-新API选择器的更多相关文章

  1. HTML5新api即pushState和replaceState实现无刷新修改url

    1,首先我面临一个需求,页面回退时需要知道来之前的页面状态.很简单,回退时在url里赋参数即可.问题是在ipad上,回退按钮是安卓那边的,我控制不了.只好采用js无刷新修改url历史记录,来告诉服务器 ...

  2. HTML5新特性之移动设备API

    为了更好地为移动设备服务,HTML5推出了一系列针对移动设备的API. 1.Geolocation API Geolocation接口用于获取用户的地理位置.它使用的方法基于GPS或者其他机制(比如I ...

  3. HTML5的JavaScript选择器介绍

    在HTML5出现之前使用JavaScript查找DOM元素,有以下三种原生的方法: getElementById:根据指定元素的id属性返回元素 getElementsByName:返回所有指定nam ...

  4. HTML5 程序设计 - 使用HTML5 Canvas API

    请你跟着本篇示例代码实现每个示例,30分钟后,你会高喊:“HTML5 Canvas?!在哥面前,那都不是事儿!” 呵呵.不要被滚动条吓到,很多都是代码和图片.我没有分开写,不过上面给大家提供了目录,方 ...

  5. HTML5 Drop API

    转自:http://www.cnblogs.com/fsjohnhuang/p/3961066.html 一.前言    在HTML4的时代,各前端工程师为了实现拖拽功能可说是煞费苦心,初听HTML5 ...

  6. Three.js + HTML5 Audio API 打造3D音乐频谱,Let’s ROCK!

    继续玩味之前写的音乐频谱作品,将原来在Canvas标签上的 作图利用Three.js让它通过WebGL呈现,这样就打造出了一个全立体感的频谱效果了. 项目详情及源码 项目GitHub地址:https: ...

  7. HTML5 File API — 让前端操作文件变的可能

    前言 在 HTML5 File API 出现之前,前端对于文件的操作是非常有局限性的,大多需要配合后端实现.出于安全角度考虑,从本地上传文件时,代码不可能获取文件在用户本地的地址,所以纯前端不可能完成 ...

  8. 开大你的音响,感受HTML5 Audio API带来的视听盛宴

    话说HTML5的炫酷真的是让我爱不释手,即使在这个提到IE就伤心不完的年代.但话又说回来,追求卓越Web创造更美世界这样高的追求什么时候又与IE沾过边儿呢?所以当你在看本文并且我们开始讨论HTML5等 ...

  9. HTML5新的标签和属性

    <article>标签定义外部的内容.比如来自一个外部的新闻提供者的一篇新的文章,或者来自 blog 的文本,或者是来自论坛的文本.亦或是来自其他外部源内容. HTML5:<arti ...

  10. html5新特性

    这一篇博文不会告诉你怎么去使用html5的新特性,只会给你总结一下新特性------对于好学的人可以把这篇文章当做一个目录 对于初接触的人来说是一个导向 对于已经接触过的人来说是一个检测你掌握程度的检 ...

随机推荐

  1. IGS_学习笔记07_IREP通过页面测试客户化Web Service调用(案例)

    20150819 Created By BaoXinjian

  2. IREP_SOA Integration程序注释语法Annotations(概念)

    20150506 Created By BaoXinjian

  3. HDU 4539 郑厂长系列故事――排兵布阵(曼哈顿距离)

    这虽然是中文题,然而没看懂,不懂的地方,就是在曼哈顿距离这块,网上搜索了一下,写了个程序,是测试曼哈顿距离的. 曼哈顿距离:两点(x1,y1)(x2,y2)的曼哈顿距离为|x1-x2|+|y1-y2| ...

  4. [复变函数]第05堂课 1.4 复球面与 $\infty$; 作业讲解; 2 解析函数 2.1 解析函数的概念与 Cauchy-Riemann 方程

    1. 复球面 大漠孤烟直, 长河落日圆. $$\bex \bbC\cong \bbS^2\bs \sed{N},\quad \bbC_\infty=\bbC\cup \sed{\infty}\mbox ...

  5. Carath\'eodory 不等式

    (Carath\'eodory 不等式) 利用 Scharwz 引理及线性变换, 证明: 若函数 $f(z)$ 在圆 $|z|<R$ 内全纯, 在 $|z|\leq R$ 上连续, $M(r)$ ...

  6. Linux系统时间设置(转载)

    Linux时钟分为系统时钟(System Clock)和硬件(Real Time Clock,简称RTC)时钟.系统时钟是指当前Linux Kernel中的时钟,而硬件时钟则是主板上由电池供电的时钟, ...

  7. Shell中set用法(转载)

    使用set命令可以设置各种shell选项或者列出shell变量. 单个选项设置常用的特性. 在某些选项之后-o参数将特殊特性打开. 在某些选项之后使用+o参数将关闭某些特性, 不带任何参数的set命令 ...

  8. rails中两种回滚-reversible和revert区别

    1 通常迁移内容写在change方法中 ,但是有些迁移内容不能自动通过执行rake:rollback回滚, 所以在迁移文件里要使用 reversible 方法,告诉rails如何回滚例如下面 # co ...

  9. java io InputStream 转 byte

    InputStream is ; ByteArrayOutputStream baos = new ByteArrayOutputStream(); byte[] b = new byte[1024] ...

  10. relative和absolute的效果

    我对这样几个效果不是特别理解: 1.float的效果: 就是搞不清楚我想要什么效果的时候可以将某个标签设置为float,一直没总结出什么规律. 2.relative和absolute的效果: 也是不清 ...