选在符的API的核心有两个方法:querySelector()和querySelectorAll()
querySelector(a):a是一个css选择符,返回与该模式匹配的第一个元素,如果没有匹配的元素,返回null.

  var result = {};
result = document.querySelector("body"); //[object HTMLBodyElement]
result = document.querySelector("#guoDiv").innerHTML; //div里面的内容

css选择符可以简单也可以复杂.如果传入不被支持的选择符,querySelector();会抛出错误.
querySelectorAll(a);
a也是一个css选择符,但是返回的是所有匹配元素而不仅仅是一个元素.返回的是一个NodeList的实例

 result =  document.querySelectorAll(".guoDiv");
alert(result.length); //4

javascript DOM扩展querySelector()和和querySelectorAll()的更多相关文章

  1. 关于javascript dom扩展:Selector API

    众多javascript库中最常用的一项功能,就是根据css选择符选择与某个模式匹配的DOM元素.之前由于对javascript的认识较低,对javascript对DOM操作还停留在getElemen ...

  2. javascript DOM操作之 querySelector,querySelectorAll

    javascript DOM操作之 querySelector,querySelectorAll

  3. 《JAVASCRIPT高级程序设计》DOM扩展

    虽然DOM为XML及HTML文档交互制定了一系列的API,但仍然有几个规范对标准的DOM进行了扩展.这些扩展中,有很多是浏览器专有的,但后来成了事实标准,于是其他浏览器也提供了相同的实现:浏览器开发商 ...

  4. JavaScript基础笔记(八)DOM扩展

    DOM扩展 一.选择符API Selectors API是由W3C发起制定的一个标准,致力于让浏览器原生支持CSS查询. 一)querySelector() 在Document和Element类型实例 ...

  5. js学习笔记----JavaScript中DOM扩展的那些事

    什么都不说,先上总结的图~   Selectors API(选择符API) querySelector()方法 接收一个css选择符,返回与该模式匹配的第一个元素,如果没有找到匹配的元素,返回null ...

  6. javascript权威指南第11章 DOM扩展

    //javascript 权威指南 第三版 第11章 DOM扩展 //取得body元素 var body = document.querySelector("body"); //取 ...

  7. 强大的原生DOM选择器querySelector和querySelectorAll

    在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 tag, name, id ...

  8. 原生JS强大DOM选择器querySelector与querySelectorAll

    在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 tag, name, id ...

  9. 原生的强大DOM选择器querySelector - querySelector和querySelectorAll

    在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 tag, name, id ...

随机推荐

  1. tomcat部署和启动3

    点击STATUES,弹出登陆框 You are not authorized to view this page. If you have not changed any configuration ...

  2. 设置MaskedTextBox控件的格式,掩码方式检验输入方式

    #region 设置MaskedTextBox控件的格式,掩码方式检验输入方式 /// <summary> /// 将MaskedTextBox控件的格式设为yyyy-mm-dd格式. / ...

  3. python3:文件读写+with open as语句

    转载请表明出处:https://www.cnblogs.com/shapeL/p/9141238.html 前提:文中例子介绍test.json内容: hello 我们 326342 1.文件读取 ( ...

  4. postman-进阶使用

    管理请求 保存请求-添加“打开百度首页请求” 设置请求方式为Get,地址为www.baidu.com.点击右侧保存按钮 在弹出的保存请求中设置保存的内容.Collections:百度,Request ...

  5. UI基础:视图控制器.屏幕旋转.MVC 分类: iOS学习-UI 2015-07-02 22:21 62人阅读 评论(0) 收藏

    UIViewController 视图控制器,继承自UIResponder,作用:管理视图并且响应事件 功能: 1.分担APPdelegate的工作 2.实现模块独立,能提高复用性 创建UIViewC ...

  6. matlab学习笔记 函数bsxfun repmat

    一.举例 a=rand(3,1);b=rand(1,3); c=bsxfun(@plus,a,b); d=a*b; c和d的运算类似,只不过c是外加,d是外乘. 作用:速度快>for循环> ...

  7. 批量解帧视频文件cpp

    前言 将多个视频文件进行解帧. 实现过程 1.批量获取文件路径: 2.对某个视频文件进行解帧: 代码 /************************************************ ...

  8. Spring boot 2.1.0 -- swagger2 整合

    依赖版本信息 Spring boot 2.1.0.RELEASE swagger2 2.7.0 1. mvn 配置  pom.xml 包引入 <!--swagger2依赖--> <d ...

  9. mos如何工作参考地址

    https://wenku.baidu.com/view/c118c3fb360cba1aa811da9d.html?qq-pf-to=pcqq.c2c

  10. HDU2034:人见人爱A-B

    Problem Description 参加过上个月月赛的同学一定还记得其中的一个最简单的题目,就是{A}+{B},那个题目求的是两个集合的并集,今天我们这个A-B求的是两个集合的差,就是做集合的减法 ...