<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的选择器的更多相关文章

  1. html5新增选择器

    分享点html5的学习笔记,比较基础,突然发现通过写博客来记笔记有很多优点呢,平常记得笔记比较简单,复习起来比较吃力,看自己的博客理解起来还比较轻松,而且只有真正理解了才能表达清楚让别人看懂,还锻炼语 ...

  2. html5时间选择器

    HTML5日期输入类型(date)   分享   分享   分享   分享   分享 在很多页面和web应用中都有输入日期和时间的地方,最典型的是订飞机票,火车票,酒店,批萨等网站. 在HTML5之前 ...

  3. html5 中高级选择器 querySelector

    简介 HTML5向Web API新引入了document.querySelector以及document.querySelectorAll两个方法用来更方便地从DOM选取元素,功能类似于jQuery的 ...

  4. html5 css选择器。 井号，句号的区别

    .理解CSS的样式组成CSS里的样式表是有规则组成的,每条规则有三个部分组成:1.选择器(如下面例子中的:“body”),告诉浏览器文档的哪个部分受规则影响:2.属性(如实例中的font-family ...

  5. html5 css选择器 井号, 句点的区别

    一.理解CSS的样式组成CSS里的样式表是有规则组成的,每条规则有三个部分组成:1.选择器(如下面例子中的:"body"),告诉浏览器文档的哪个部分受规则影响:2.属性(如实例中的 ...

  6. html5——css选择器

    复习 div>p: 子代 div+p:div后面相邻的第一个p div~p: div后面所有的兄弟p 属性选择器 标志:[]:区别于id选择器:#,区别于类名选择器:. 特殊符号:^:开头    ...

  7. html5 新选择器 querySelector querySelectorAll

    querySelector 返回满足条件的单个元素 使用实例 HTML <div id="main">主体布局</div> JS var main =doc ...

  8. [HTML5] 颜色选择器的操作[input type='color'....]

    一.点击事件和获取颜色值 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  9. 第87天：HTML5中新选择器querySelector的使用

    一.HTML5新选择器 1.document.querySelector("selector");selector:根据CSS选择器返回第一个匹配到的元素,如果没有匹配到,则返回n ...

随机推荐

  1. docker存储结构解析

    由于aufs并未并入内核,故而目前只有Ubuntu系统上能够使用aufs作为docker的存储引擎,而其他系统上使用lvm thin provisioning(overlayfs是一个和aufs类似的 ...

  2. IIS 7.0 部署MVC

    开发的MVC 3.0 项目,在部署服务上还是与需要花一点功夫,这里把遇到的问题罗列出来. 本文主要介绍IIS 7.5中安装配置MVC 3.0的具体办法! 部署必备: Microsoft .net Fr ...

  3. Run Loop详解

    Run loops是线程的基础架构部分.一个run loop就是一个事件处理循环,用来不停的调配工作以及处理输入事件.使用run loop的目的是使你的线程在有工作的时候工作,没有的时候休眠. Run ...

  4. ios中图片拉伸用法

    - (UIImage *)stretchableImageWithLeftCapWidth:(NSInteger)leftCapWidth topCapHeight:(NSInteger)topCap ...

  5. ios启动载入启动图片

    版本判断: 1.首先你要知道这个键值对的key:id key =   (id)kCFBundleVersionKey; 2.同过本地的NSBundle取得当前的版本号. 3.在沙盒中取得对应的版本号. ...

  6. 感知器、逻辑回归和SVM的求解

    这篇文章将介绍感知器.逻辑回归的求解和SVM的部分求解,包含部分的证明.本文章涉及的一些基础知识,已经在<梯度下降.牛顿法和拉格朗日对偶性>中指出,而这里要解决的问题,来自<从感知器 ...

  7. Android EditText输入格式设置

    在开发的过程中,通常会用到EditText,如何让虚拟键盘来适应输入框中内容的类型,通常我们都会在xml文件中加入android:inputType="". android:inp ...

  8. android 自定义View Caused by: java.lang.ClassNotFoundException: Didn't find class

    在android studio中, 自定义View 时,出现 Caused by: java.lang.ClassNotFoundException: Didn't find class 在查看包名和 ...

  9. 翻箱倒柜，《Delphi中建议使用的语句》

    (*//标题:Delphi中建议使用的语句整理:Zswang连接:http://www.csdn.net/Expert/TopicView1.asp?id=724036日期:2002-06-22支持: ...

  10. Netty是什么?

    Netty是什么? 本质:JBoss做的一个Jar包 目的:快速开发高性能.高可靠性的网络服务器和客户端程序 优点:提供异步的.事件驱动的网络应用程序框架和工具 通俗的说:一个好使的处理Socket的 ...