jquery中获取元素的几种方式小结
1 从集合中通过指定的序号获取元素
html:
<p>0</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
</div>
JS
jQuery(function(){
$("p").eq(2).css("color","red");
$("p").eq(3).css("color","red");
})
</script>
2 获取指定条件一致和指定范围的元素
html:
<p>0</p>
<p>1</p>
<p class="center">2</p>
<p class="center">3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
</div>
JS
jQuery(function(){
$("p").filter('.center').css("color","red");
})
$(function(){
$("p").slice(5,7).css("color","yellow");
})
</script>
3 获取与条件表达式一致的元素
html:
<p>0</p>
<p>1</p>
<p class="center">2</p>
<p class="center">3</p>
<p>4</p>
<p class="aa">5</p>
<p>6</p>
<p>7</p>
</div>
js
jQuery(function(){
$("p").each(function(){
switch(true){
case $(this).is(".center"):
$(this).css("color","red");
break;
case $(this).is(".aa"):
$(this).css("color","yellow");
break;
}
})
})
</script>
4 获取元素的上一个元素和下一个元素
Html:
<p>1号</p>
<p class="yes">2号</p>
<p>3号</p>
<p>4号</p>
<p>5号</p>
<p class="yes">6号</p>
<p class="yes">7号</p>
</div>
js
jQuery(function(){
$("p").next(".yes").css("color","red");
})
//获取元素的上一个元素
jQuery(function(){
$("p").prev(".yes").css("color","red");
})
5 获取元素的父元素和子元素
html:
<p>1号</p>
<p class="yes">2号</p>
<p>3号</p>
<p>4号</p>
<p>5号</p>
<p class="yes">6号</p>
<p class="yes">7号</p>
</div>
js
jQuery(function(){
$("p").parent().css("color","red");
})
//获取元素的子元素
jQuery(function(){
$("#aa").children(".yes").css("color","red");
})
jquery中获取元素的几种方式小结的更多相关文章
- jQuery中开发插件的两种方式
jQuery中开发插件的两种方式(附Demo) 做web开发的基本上都会用到jQuery,jQuery插件开发两种方式:一种是类扩展的方式开发插件,jQuery添加新的全局函数(jQuery的全局函数 ...
- AngularJS中获取数据源的几种方式
在AngularJS中,可以从$rootScope中获取数据源,也可以把获取数据的逻辑封装在service中,然后注入到app.run函数中,或者注入到controller中.本篇就来整理获取数据的几 ...
- jQuery中开发插件的两种方式(附Demo)
做web开发的基本上都会用到jQuery,jQuery插件开发两种方式:一种是类扩展的方式开发插件,jQuery添加新的全局函数(jQuery的全局函数是属于jQuery命名空间的函数),如果将jQu ...
- 关于dom获取元素的几种方式
原文链接:https://blog.csdn.net/levinhax/article/details/71274456 获取元素DOM对象有很多种方法,以前一直在用getElementById和ge ...
- android中获取打气筒的几种方式
1,简单说明,打气筒就是将我们的xml布局转换为我们的view对象,不扯远了,直接看代码 A:从context中获取 LayoutInflater inflater1 = LayoutInflater ...
- Spring在代码中获取bean的几种方式
方法一:在初始化时保存ApplicationContext对象 方法二:通过Spring提供的utils类获取ApplicationContext对象 方法三:继承自抽象类ApplicationObj ...
- Spring在代码中获取bean的几种方式(转:http://www.dexcoder.com/selfly/article/326)
方法一:在初始化时保存ApplicationContext对象 方法二:通过Spring提供的utils类获取ApplicationContext对象 方法三:继承自抽象类ApplicationObj ...
- Spring在代码中获取bean的几种方式(转)
获取spring中bean的方式总结: 方法一:在初始化时保存ApplicationContext对象 ApplicationContext ac = new FileSystemXmlApplica ...
- 001-Spring在代码中获取bean的几种方式
一.概述 方法一:在初始化时保存ApplicationContext对象 方法二:通过Spring提供的utils类获取ApplicationContext对象 方法三:继承自抽象类Applicati ...
随机推荐
- 分布式blog系统 TFS总结
解决的问题 文件总量太大 一台服务器无法存放 只能放在网络集群中分节点存放 也就是通过屏蔽网络部分 形成一个“ one big CPU” 和 “one big disk” .Client只需要向 ...
- RaphaelJS实践--猫和老鼠矢量图展示
(目前发现一些文章被盗用的情况,我们将在每篇文章前面添加原文地址,本文源地址:http://www.cnblogs.com/idealer3d/p/tomAndJerryRaphaelVectorGr ...
- awk(1)-简述
1.概述 AWK is a programming language designed for text processing and typically used as a data extract ...
- ListView只允许展开其中一个item的方法
xml文件代码: <?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:an ...
- bootstrap-14
基础导航条: 使用方法:1. 首先在制作导航的列表(<ul class="nav">)基础上添加类名"navbar-nav" 2.在列表外部添加一个 ...
- sublime 中文乱码
一.安装Package Control 使用Sublime Text2首先就要安装Package Control,这样就能使用丰富的插件包了 (1)访问Package Control站点按照提示复 ...
- UNITY更新到5后设置的动画无法播放了怎么办
点击对应的animator,将 apply root motion 这个选项的勾去掉就可以了,纠结了很久最后在UNITY官方论坛找到的答案
- HDU 1026 Ignatius and the Princess I(带路径的BFS)
http://acm.hdu.edu.cn/showproblem.php?pid=1026 题意:给出一个迷宫,求出到终点的最短时间路径. 这道题目在迷宫上有怪物,不同HP的怪物会损耗不同的时间,这 ...
- hiho一下123周 后缀数组四·重复旋律
后缀数组四·重复旋律4 时间限制:5000ms 单点时限:1000ms 内存限制:256MB 描述 小Hi平时的一大兴趣爱好就是演奏钢琴.我们知道一个音乐旋律被表示为长度为 N 的数构成的数列.小Hi ...
- 用 windows GDI 实现软光栅化渲染器--gdi3d(开源)
尝试用windows GDI实现了一个简单的软光栅化渲染器,把OpenGL渲染管线实现了一遍,还是挺有收获的,搞清了以前一些似是而非的疑惑. ----更新2015-10-16代码已上传.gihub地址 ...