html5新增选择器
分享点html5的学习笔记,比较基础,突然发现通过写博客来记笔记有很多优点呢,平常记得笔记比较简单,复习起来比较吃力,看自己的博客理解起来还比较轻松,而且只有真正理解了才能表达清楚让别人看懂,还锻炼语言表达能力呢,所以有条件就多写点东西吧
选择器
1 querySelector(如果是一组元素,只能获取到一组中的第一个元素)
document.querySelector("#div1");
document.querySelector(".div1");
document.querySelector("[title=hello]");
2 querySelectorAll (可以获取一组元素,不过不能直接给所有元素设置样式,得用循环)
document.querySelectorAll(".box");
3 getElementsByClassName(只针对class,相见恨晚的选择器)
document.getElementsByClassName('box')
html5提供了class列表属性以及操作class的方法
classList :得到的是所在节点的所有class 返回类似数组的对象类型
length : class的长度
add() : 添加class方法
remove() : 删除class方法
toggle() : 切换class方法 toggle("a") 如果列表中存在a 就执行删除操作,不存在就执行添加操作
var oDiv = document.querySelector("#div1");
oDiv.classList.length // 3
oDiv.classList.add("div0")//增加class 其他用法大致相同
<div class="div1 div2 div3" id="div1"></div>
html5新增选择器的更多相关文章
- 深入理解javascript选择器API系列第三篇——HTML5新增的3种selector方法
前面的话 尽管DOM作为API已经非常完善了,但是为了实现更多的功能,DOM仍然进行了扩展,其中一个重要的扩展就是对选择器API的扩展.人们对jQuery的称赞,很多是由于jQuery方便的元素选择器 ...
- 7-80 HTML5新增的JS选择器
7-80 HTML5新增的JS选择器 学习要点 HTML5新增的JS选择器 在传统的 JavaScript 开发中,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 ta ...
- HTML5 学习总结(二)——HTML5新增属性与表单元素
一.HTML5新增属性 1.1.contextmenu contextmenu的作用是指定右键菜单. <!DOCTYPE html> <html> <head> & ...
- HTML5 学习笔记(二)——HTML5新增属性与表单元素
目录 一.HTML5新增属性 1.1.contextmenu 1.2.contentEditable 1.3.hidden 1.4.draggable 1.5.data-* 1.6.placehold ...
- HTML5新增标签与属性
目录 一.HTML5新增属性 1.1.contextmenu 1.2.contentEditable 1.3.hidden 1.4.draggable 1.5.data-* 1.6.placehold ...
- html5新增及删除标签
一.新增标签 有一种划分为,功能性标签[html5新增,如canvas,旧浏览器没有]和语义性标签[如header等只是增强语义,没有新功能].下面按照分几个小类来说. 1.结构标签 新增的结构标签, ...
- HTML5新增的一些属性和功能之一
大致可以分为10个方面: HTML5表单元素和属性 表单2.0 视音频处理 canvas绘图 SVG绘图 地理定位 拖放技术 web work web storage web socket 一.新的i ...
- 玩转html5(一)-----盘点html5新增的那些酷酷的input类型和属性
今天正式开始学习html5了,相比html以前的版本,html5新增了好多功能,属性,使我们做出来的界面更加的绚丽,而且使用起来超级简单,这篇文章先来说说html增加的那些input类型和属性. 这些 ...
- html5新增标签/删除标签
闲聊: 最近小颖工作稍微比较轻松,没事就看看慕课,看了看:HTML5之元素与标签结构,里面简单讲解了下HTML5的一些新特性,小颖之前没写过HTML5的页面,所以就当写笔记将那些新的特性整理出来,也方 ...
随机推荐
- MongoDB学习笔记——文档操作之查询
查询文档 使用db.COLLECTION_NAME.findOne()可以查询所有满足条件的第一条数据 预发格式如下: db.COLLECTION_NAME.findOne(<query> ...
- C中不安全函数
C 中大多数缓冲区溢出问题可以直接追溯到标准 C 库.最有害的罪魁祸首是不进行自变量检查的.有问题的字符串操作(strcpy.strcat.sprintf 和 gets).一般来讲,象“避免使用 st ...
- 迅为顶级四核开发板 Exynos4412开发板,仅售560元
业内公认最强四核 藐视一切挑战 ●四核CPU ●四核GPU ●双通道内存 ●HKMG技术 ●超级性能 ●至佳稳定 ●供货周期长 Exynos 4412处理器成功应用于三星GALAXY S3 ...
- Storm之spout,bolt编写
Storm,核心代码使用clojure书写,实用程序使用python开发,使用java开发拓扑. Nimbus节点接收到请求,对提交的拓扑进行分片,分成一个个的task,并将task和supervis ...
- 我的NopCommerce之旅(6): 应用启动
一.基础介绍 Global.asax 文件(也称为 ASP.NET 应用程序文件)是一个可选文件,该文件包含响应 ASP.NET 或 HTTP 模块所引发的应用程序级别和会话级别事件的代码. Appl ...
- 怎么学习计算电磁学【QUORA】
链接 There are several resources. But it depends on what you actually want to learn...Let me explain: ...
- noip2008普及组3题题解-rLq
(第一次写题解,随意喷) (只是前一天的作业哈) (先凑个数) 题目描述 上体育课的时候,小蛮的老师经常带着同学们一起做游戏.这次,老师带着同学们一起做传球游戏.游戏规则是这样的:n个同学站成一个圆圈 ...
- MySql目录没有data文件夹怎么办
下载的是mysql的压缩包,解压后,更改my.ini文件,里面有个指向data文件夹的路径,但是mysql安装目录没有data文件夹,需要执行 mysqld --initialize --user=m ...
- URAL 2014 Zhenya moves from parents --线段树
题意:儿子身无分文出去玩,只带了一张他爸的信用卡,当他自己现金不足的时候就会用信用卡支付,然后儿子还会挣钱,挣到的钱都是现金,也就是说他如果有现金就会先花现金,但是有了现金他不会还信用卡的钱.他每花一 ...
- Unity3D开发赛车Demo遇到的问题
遇到问题 在3D Max中导出的跑车在Unity中轴向不对,不知有没有朋友遇到过呢? 切换坐标系统 在Unity3D中按X键,切换坐标系统 车轮方向变了 运行游戏之后,赛车的车轮方向变歪了 车依然能跑 ...