html5的选择器
<body>
<p class="aa">aaa</p>
<p class="bb">bbb</p>
<p id="cc">ccc</p>
</body>
<script>
//第一个class为aa的JS对象
console.info(document.querySelector('.aa').childNodes[0].nodeValue); //选择id
console.info(document.querySelector('#bb').textContent); //查找所有元素返回JS对象数组
var allEle=document.querySelectorAll("*");
for(var i=0;i<allEle.length;i++){
console.info(allEle[i].tagName)
} //选择第一个tagName为p的元素
console.info(document.querySelector('p')); //根据属性选择
console.info(document.querySelector('p[id="bb"]').innerHTML); </script>
html5的选择器的更多相关文章
- html5新增选择器
分享点html5的学习笔记,比较基础,突然发现通过写博客来记笔记有很多优点呢,平常记得笔记比较简单,复习起来比较吃力,看自己的博客理解起来还比较轻松,而且只有真正理解了才能表达清楚让别人看懂,还锻炼语 ...
- html5时间选择器
HTML5日期输入类型(date) 分享 分享 分享 分享 分享 在很多页面和web应用中都有输入日期和时间的地方,最典型的是订飞机票,火车票,酒店,批萨等网站. 在HTML5之前 ...
- html5 中高级选择器 querySelector
简介 HTML5向Web API新引入了document.querySelector以及document.querySelectorAll两个方法用来更方便地从DOM选取元素,功能类似于jQuery的 ...
- html5 css选择器。 井号，句号的区别
.理解CSS的样式组成CSS里的样式表是有规则组成的,每条规则有三个部分组成:1.选择器(如下面例子中的:“body”),告诉浏览器文档的哪个部分受规则影响:2.属性(如实例中的font-family ...
- html5 css选择器 井号, 句点的区别
一.理解CSS的样式组成CSS里的样式表是有规则组成的,每条规则有三个部分组成:1.选择器(如下面例子中的:"body"),告诉浏览器文档的哪个部分受规则影响:2.属性(如实例中的 ...
- html5——css选择器
复习 div>p: 子代 div+p:div后面相邻的第一个p div~p: div后面所有的兄弟p 属性选择器 标志:[]:区别于id选择器:#,区别于类名选择器:. 特殊符号:^:开头 ...
- html5 新选择器 querySelector querySelectorAll
querySelector 返回满足条件的单个元素 使用实例 HTML <div id="main">主体布局</div> JS var main =doc ...
- [HTML5] 颜色选择器的操作[input type='color'....]
一.点击事件和获取颜色值 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...
- 第87天：HTML5中新选择器querySelector的使用
一.HTML5新选择器 1.document.querySelector("selector");selector:根据CSS选择器返回第一个匹配到的元素,如果没有匹配到,则返回n ...
随机推荐
- win10开机自动启动小键盘
打开注册表 展开到HKEY_USERS\.DEFAULT\Control Panel\Keyboard 再选择InitialKeyboardIndicators, 将其数值数据修改为2(Win7)/8 ...
- win上搭建react-native android环境
http://www.jianshu.com/p/2fdc4655ddf8 http://www.lcode.org/ http://www.jianshu.com/p/ad29d97b0e9d 学习 ...
- oracle数据库如何创建表空间，临时表空间
目标 1.创建表空间 lxy 2.创建临时表空间tmp_lxy create tablespace lxy datafile '/u01/app/oracle/oradata/LXY/lxy.dbf' ...
- flddler使用方法
http://blog.csdn.net/geekgjie/article/details/8029936
- recyleView使用笔记
直接上代码: package com.test.recycleview; import android.app.Activity; import android.graphics.Canvas; im ...
- 116、Android获取Manifest中<meta-data>元素的值
在AndroidManifest.xml中,<meta-data>元素可以作为子元素, 被包含在<activity>.<application> .<serv ...
- form表单的enter自动提交
当form中只有一个文本框时并且获得焦点 按enter时,就会自动提交表单.阻止自动提交 可以添加一个隐藏的input框 <input type="text" style=& ...
- linux 网卡启动方法
CentOS 7默认的网卡名称是eno16777736 一般人的是 eth0 编辑配置文件 vi /etc/sysconfig/network-scripts/ifcfg-eno16777736把 O ...
- windows下CMake使用图文手册 Part 4
例子4:链接静态库(.lib) 例子3里面我们构建了date.lib, 这个例子里我们调用这个库. 前提: date.h的头文件在 E:\Playground\CMakeExamples\DateLi ...
- iPhone与iPad在开发上的区别
*:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...