DOM 的选择器 API

【DOM 的选择器 API】的更多相关文章

在刚开始的时候,我们只能用 getElementById,getElementsByClassName,getElementsByTagName 这几个 DOM 方法查找 DOM 树中的元素.后来,在 W3C 的选择器 API 标准中[1],提供了 querySelector 和 querySelectorAll 这两个利用 CSS 选择器查找元素的方法.它们的语法如下: element = document.querySelector(selectors); elementList = doc…

jacascript DOM节点——节点获取与选择器API

前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! DOM 操作必须等待 HTML 加载完毕之后,才可以获取节点:有两种方法: 把 script 标签放到代码的最后: 使用 window.onload 事件或者 JQuery 的 ready 事件: 一般情况一个页面响应加载的顺序是,域名解析---加载html---加载js和css---加载图片等其他信息. window.onload 和 JQuery 的 ready事件的区别: window.onloa…

深入理解javascript选择器API系列第三篇——h5新增的3种selector方法

× 目录 [1]方法 [2]非实时 [3]缺陷前面的话尽管DOM作为API已经非常完善了,但是为了实现更多的功能,DOM仍然进行了扩展,其中一个重要的扩展就是对选择器API的扩展.人们对jQuery的称赞,很多是由于jQuery方便的元素选择器.除了前面已经介绍过的getElementsByClassName()方法外,DOM拓展了querySelectorAll().querySelector()和matchesSelector()这3种方法,通过CSS选择符查询DOM文档取得元素的引用的…

深入理解javascript选择器API系列第三篇——HTML5新增的3种selector方法

前面的话尽管DOM作为API已经非常完善了,但是为了实现更多的功能,DOM仍然进行了扩展,其中一个重要的扩展就是对选择器API的扩展.人们对jQuery的称赞,很多是由于jQuery方便的元素选择器.除了前面已经介绍过的getElementsByClassName()方法外,DOM拓展了querySelectorAll().querySelector()和matchesSelector()这3种方法,通过CSS选择符查询DOM文档取得元素的引用的功能变成了原生的API,解析和树查询操作在浏览器…

JavaScript实现DOM对象选择器

目的: 根据传入的选择器类型选出第一个符合的DOM对象. ①可以通过id获取DOM对象,例如 $("#adom"); ②可以通过tagName获取DOM对象,例如 $("a"); ③可以通过样式名称获取DOM对象,例如 $(".classa"); ④可以通过attribute匹配获取DOM对象,例如 $("[data-log]"),$("[data-time=2015]"); ⑤可以通过层叠组合获取DOM对…

DOM的选择器

这几天学习了DOM的选择器,现在来进行一下总结分类. 1.DOM里的元素节点选择器元素节点选择器包括id,class,name,tagname,高级,关系. 1.1 id选择器 id:返回的是单个对象相关标签代码 <body> <div id="box">1</div> <div id="box">2</div> <div id="box">3</div> &…

Dom直接选择器

Dom直接选择器 <!DOCTYPE html>  <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .d1 { display: inline-block; width: 455px; /*一行4个*/ margin: auto; } .d…

DOM扩展-Selectors API(选择符 API)、元素遍历

DOM扩展对DOM的两个主要扩展是SelectorsAPI(选择符API)和HTML5 SelectorsAPI(选择符API)是由W3C发起制定的一个标准,致力于浏览器原生支持CSS查询,SelectorsAPILevel 1的核心是两个方法:querySelector()和querySelectorAll(),可以通过Document及Element类型的实例调用他们. querySelector()方法接受一个CSS选择符,返回与该模式匹配的第一个元素,如果没有找到匹配的元素,返回nul…

DOM querySelector选择器

原生的强大DOM选择器querySelector 在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 tag, name, id 等方式来查找,这显然是远远不够的,如果想要进行更为精确的选择不得不使用看起来非常繁琐的正则表达式,或者使用某个库.事实上,现在所有的浏览器厂商都提供了 querySelector 和 querySelectorAll 这两个方法的支持,甚至就连微软也…

原生JS中DOM节点相关API合集

节点属性 Node.nodeName //返回节点名称,只读 Node.nodeType //返回节点类型的常数值,只读 Node.nodeValue //返回Text或Comment节点的文本值,只读 Node.textContent //返回当前节点和它的所有后代节点的文本内容,可读写 Node.baseURI //返回当前网页的绝对路径 Node.ownerDocument //返回当前节点所在的顶层文档对象,即document Node.nextSibling //返回紧跟在当前节点…