jQuery选择器之类选择器
来源:互联网 发布:数据库学籍管理系统 编辑:程序博客网 时间:2024/05/01 06:43
类选择器,顾名思义,通过class样式类名来获取节点
$( ".class" )
类选择器,相对id选择器来说,效率相对会低一点,但是优势就是可以多选
同样的jQuery在实现上,对于类选择器,如果浏览器支持,jQuery使用JavaScript的原生getElementsByClassName()函数来实现的。
jQuery除了选择上的简单,而且没有再次使用循环处理。
不难想到$(“.imooc”).css()方法内部肯定是带了一个隐式的循环处理,所以使用jQuery选择节点,不仅仅只是选择上的简单,同时还增加很多关联的便利操作,后续我们还会慢慢的学到其他的优势。
<!DOCTYPE html><html><head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title></title> <style> div { width: 100px; height: 90px; float: left; padding: 5px; margin: 5px; background-color: #EEEEEE; } </style> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script></head><body> <div class="aaron"> <p>class="aaron"</p> <p>选中</p> </div> <div class="aaron"> <p>class="aaron"</p> <p>选中</p> </div> <div class="imooc"> <p>class="imooc"</p> <p>jQuery选中</p> </div> <div class="imooc"> <p>class="imooc"</p> <p>jQuery选中</p> </div> <script type="text/javascript"> //通过原生方法处理 //样式是可以多选的,所以得到的是一个合集 //需要通过循环给合集中每一个元素修改样式 var divs = document.getElementsByClassName('aaron'); for (var i = 0; i < divs.length; i++) { divs[i].style.border = "3px solid blue"; } </script> <script type="text/javascript"> //通过jQuery直接传入class //class选择器可以选择多个元素 $(".imooc").css("border", "3px solid red"); </script></body></html>
阅读全文
0 0
- jQuery选择器之类选择器
- jQuery选择器之类选择器
- jQuery选择器之类选择器
- CSS选择器,jQuery选择器
- jQuery选择器 CSS选择器
- JQuery选择器(选择器简介)
- jQuery选择器 基本选择器
- jQuery选择器 层次选择器
- jQuery选择器 表单选择器
- Jquery选择器-基本选择器
- Jquery选择器--过滤选择器
- JQuery选择器
- jquery 选择器
- Jquery选择器
- jQuery选择器
- jQuery 选择器
- JQuery选择器
- JQuery选择器
- Spark2.1.1中用各种模式运行计算圆周率的官方Demo
- ACM 第八届山东省赛 I Parity check SDUT 3901
- 45题埃及分数
- 大数乘方 求高精度幂 NOYJ155
- max-points-on-a-line
- jQuery选择器之类选择器
- 三天打鱼两天晒网(c语言)
- Linux命令基础32-cal命令
- Container With Most Water(能装最多水的容器)
- 64-bit Tips
- SQLSever 存储过程创建
- 【项目记录】山东大学场馆管理系统之——用户部分
- C++ NULL与nullptr
- 此文谨记学习之路