HTML5-新API选择器
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+
<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选择器的更多相关文章
- HTML5新api即pushState和replaceState实现无刷新修改url
1,首先我面临一个需求,页面回退时需要知道来之前的页面状态.很简单,回退时在url里赋参数即可.问题是在ipad上,回退按钮是安卓那边的,我控制不了.只好采用js无刷新修改url历史记录,来告诉服务器 ...
- HTML5新特性之移动设备API
为了更好地为移动设备服务,HTML5推出了一系列针对移动设备的API. 1.Geolocation API Geolocation接口用于获取用户的地理位置.它使用的方法基于GPS或者其他机制(比如I ...
- HTML5的JavaScript选择器介绍
在HTML5出现之前使用JavaScript查找DOM元素,有以下三种原生的方法: getElementById:根据指定元素的id属性返回元素 getElementsByName:返回所有指定nam ...
- HTML5 程序设计 - 使用HTML5 Canvas API
请你跟着本篇示例代码实现每个示例,30分钟后,你会高喊:“HTML5 Canvas?!在哥面前,那都不是事儿!” 呵呵.不要被滚动条吓到,很多都是代码和图片.我没有分开写,不过上面给大家提供了目录,方 ...
- HTML5 Drop API
转自:http://www.cnblogs.com/fsjohnhuang/p/3961066.html 一.前言 在HTML4的时代,各前端工程师为了实现拖拽功能可说是煞费苦心,初听HTML5 ...
- Three.js + HTML5 Audio API 打造3D音乐频谱,Let’s ROCK!
继续玩味之前写的音乐频谱作品,将原来在Canvas标签上的 作图利用Three.js让它通过WebGL呈现,这样就打造出了一个全立体感的频谱效果了. 项目详情及源码 项目GitHub地址:https: ...
- HTML5 File API — 让前端操作文件变的可能
前言 在 HTML5 File API 出现之前,前端对于文件的操作是非常有局限性的,大多需要配合后端实现.出于安全角度考虑,从本地上传文件时,代码不可能获取文件在用户本地的地址,所以纯前端不可能完成 ...
- 开大你的音响,感受HTML5 Audio API带来的视听盛宴
话说HTML5的炫酷真的是让我爱不释手,即使在这个提到IE就伤心不完的年代.但话又说回来,追求卓越Web创造更美世界这样高的追求什么时候又与IE沾过边儿呢?所以当你在看本文并且我们开始讨论HTML5等 ...
- HTML5新的标签和属性
<article>标签定义外部的内容.比如来自一个外部的新闻提供者的一篇新的文章,或者来自 blog 的文本,或者是来自论坛的文本.亦或是来自其他外部源内容. HTML5:<arti ...
- html5新特性
这一篇博文不会告诉你怎么去使用html5的新特性,只会给你总结一下新特性------对于好学的人可以把这篇文章当做一个目录 对于初接触的人来说是一个导向 对于已经接触过的人来说是一个检测你掌握程度的检 ...
随机推荐
- PLSQL_闪回删除FlashBack Drop表误删除如何进行恢复(案例)
2014-06-25 Created By BaoXinjian
- HDU 2188 悼念512汶川大地震遇难同胞――选拔志愿者(巴什博奕)
选拔志愿者 题意: 对于四川同胞遭受的灾难,全国人民纷纷伸出援助之手,几乎每个省市都派出了大量的救援人员,这其中包括抢险救灾的武警部队,治疗和防疫的医护人员,以及进行心理疏导的心理学专家.根据要求,我 ...
- CF 500 C. New Year Book Reading 贪心 简单题
New Year is coming, and Jaehyun decided to read many books during 2015, unlike this year. He has n b ...
- USACO CHAPTER 1 1.1 Ride 水题
水题,主要是学习文件输入输出. /* ID: ijustwa1 LANG: C++ TASK: ride */ #include<cstdio> #include<cstring&g ...
- C++程序设计原理与实践
std_lib_facilities.h和VS下创建C++程序方法:下载 目录: 001. Hello,World!
- 斑马打印机网卡ZebraNet配置(有线)
实图: 抽象图: 说明: 1.并口,用于连接斑马打印机一端 2.网络连接状态指示灯 3.打印状态指示灯 4.测试按钮,在连接打印机的情况下,按下此键,会打印出网卡信息. 5.网线接口 按下测试按钮之后 ...
- purple-class2-默认选项切换
ylbtech-class:purple-class2 A, 返回顶部 1,默认选项切换 #region 默认选项切换 public delegate IList<SelectListItemI ...
- ylbtech-Unitity-CS-Arrays:数组
ylbtech-Unitity-CS-Arrays:数组 1.A,效果图返回顶部 1.B,源代码返回顶部 1.B.1, using System; class DeclareArraysSampl ...
- python 抓取javascript 动态数据
1. 新安装一个python库 :~$ sudo pip install seleniumhq 2. 编写代码: 以获取百度百科点赞数为例 import selenium from selenium ...
- eclips中增加对jar包的引用
http://jingyan.baidu.com/article/ca41422fc76c4a1eae99ed9f.html