html5的选择器】的更多相关文章

分享点html5的学习笔记,比较基础,突然发现通过写博客来记笔记有很多优点呢,平常记得笔记比较简单,复习起来比较吃力,看自己的博客理解起来还比较轻松,而且只有真正理解了才能表达清楚让别人看懂,还锻炼语言表达能力呢,所以有条件就多写点东西吧 选择器 1 querySelector(如果是一组元素,只能获取到一组中的第一个元素) document.querySelector("#div1"); document.querySelector(".div1"); docum…
HTML5日期输入类型(date)   分享   分享   分享   分享   分享 在很多页面和web应用中都有输入日期和时间的地方,最典型的是订飞机票,火车票,酒店,批萨等网站. 在HTML5之前,对于这样的页面需求,最常见的方案是用Javascript日期选择组件.这几乎是无可争议.别无选择的做法.你可以在搜寻一下 “javascript 日期选择框”,会发现有无数的可选择的JavaScript组件.大部分这些日期选择组件都提供将日期填充到指定的输入框里的功能. HTML5里的datein…
简介 HTML5向Web API新引入了document.querySelector以及document.querySelectorAll两个方法用来更方便地从DOM选取元素,功能类似于jQuery的选择器.这使得在编写原生JavaScript代码时方便了许多. 用法 两个方法,其中,querySelector返回满足条件的单个DOM元素,按照深度院线和先序遍历的原则使用参数提供的css选择器在DOM中查找. //返回class为list下,子元素里class为item的首个DOM元素. ele…
.理解CSS的样式组成CSS里的样式表是有规则组成的,每条规则有三个部分组成:1.选择器(如下面例子中的:“body”),告诉浏览器文档的哪个部分受规则影响:2.属性(如实例中的font-family.color等),规定了布局的什么方面被设置了:3.值(如实例中的Arial,sans-serif,#333333等),给出了式样属性的值. 二.CSS式样中不同符号的区别 #是ID选择器 .是class选择器 *是通配符号 比如*{margin:0:padding:0:所有的元素都会沿用这个属性样…
一.理解CSS的样式组成CSS里的样式表是有规则组成的,每条规则有三个部分组成:1.选择器(如下面例子中的:"body"),告诉浏览器文档的哪个部分受规则影响:2.属性(如实例中的font-family.color等),规定了布局的什么方面被设置了:3.值(如实例中的Arial,sans-serif,#333333等),给出了式样属性的值. 二.CSS式样中不同符号的区别 #是ID选择器 .是class选择器 *是通配符号 比如*{margin:0:padding:0:所有的元素都会沿…
复习 div>p: 子代 div+p:div后面相邻的第一个p div~p: div后面所有的兄弟p 属性选择器 标志:[]:区别于id选择器:#,区别于类名选择器:. 特殊符号:^:开头     $:结尾      *:包含 E[title] : 选中页面的E元素,并且E需要带有title属性 E[title="abc"] :选中页面的E元素,并且E需要带有title属性,属性值为abc E[title^="abc"] :选中页面的E元素,并且E需要带有ti…
querySelector 返回满足条件的单个元素 使用实例 HTML <div id="main">主体布局</div> JS var main =document.querySelector('#main'); console.log(main) 这时候结果返回的就是 整个元素 <div id="main">主体布局</div> 返回一个查询元素 测试谷歌 IE11 IE10 IE9  火狐  可以正常使用 PS:…
<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].nodeValu…
一.点击事件和获取颜色值 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body style=" background: rgb(238, 255, 255);"> <input type="col…
一.HTML5新选择器 1.document.querySelector("selector");selector:根据CSS选择器返回第一个匹配到的元素,如果没有匹配到,则返回null;支持: Chrome 4.0+, FireFox 3.5+, Safari 3.2+, Opera 10.1+, IE 8+2.document.querySelectorAll("selector");selector:根据CSS选择器返回所有匹配到的元素数组,如果没有匹配到,则…