1 从集合中通过指定的序号获取元素 
html:

复制代码代码如下:
<div> 
<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

复制代码代码如下:
<script type="text/javascript"> 
jQuery(function(){ 
$("p").eq(2).css("color","red"); 
$("p").eq(3).css("color","red"); 
}) 
</script> 

2 获取指定条件一致和指定范围的元素 
html:

复制代码代码如下:
<div> 
<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

复制代码代码如下:
<script type="text/javascript"> 
jQuery(function(){ 
$("p").filter('.center').css("color","red"); 
}) 
$(function(){ 
$("p").slice(5,7).css("color","yellow"); 
}) 
</script> 

3 获取与条件表达式一致的元素 
html:

复制代码代码如下:
<div> 
<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

复制代码代码如下:
<script type="text/javascript"> 
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:

复制代码代码如下:
<div id="aa"> 
<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:

复制代码代码如下:
<div id="aa"> 
<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中获取元素的几种方式小结的更多相关文章

  1. jQuery中开发插件的两种方式

    jQuery中开发插件的两种方式(附Demo) 做web开发的基本上都会用到jQuery,jQuery插件开发两种方式:一种是类扩展的方式开发插件,jQuery添加新的全局函数(jQuery的全局函数 ...

  2. AngularJS中获取数据源的几种方式

    在AngularJS中,可以从$rootScope中获取数据源,也可以把获取数据的逻辑封装在service中,然后注入到app.run函数中,或者注入到controller中.本篇就来整理获取数据的几 ...

  3. jQuery中开发插件的两种方式(附Demo)

    做web开发的基本上都会用到jQuery,jQuery插件开发两种方式:一种是类扩展的方式开发插件,jQuery添加新的全局函数(jQuery的全局函数是属于jQuery命名空间的函数),如果将jQu ...

  4. 关于dom获取元素的几种方式

    原文链接:https://blog.csdn.net/levinhax/article/details/71274456 获取元素DOM对象有很多种方法,以前一直在用getElementById和ge ...

  5. android中获取打气筒的几种方式

    1,简单说明,打气筒就是将我们的xml布局转换为我们的view对象,不扯远了,直接看代码 A:从context中获取 LayoutInflater inflater1 = LayoutInflater ...

  6. Spring在代码中获取bean的几种方式

    方法一:在初始化时保存ApplicationContext对象 方法二:通过Spring提供的utils类获取ApplicationContext对象 方法三:继承自抽象类ApplicationObj ...

  7. Spring在代码中获取bean的几种方式(转:http://www.dexcoder.com/selfly/article/326)

    方法一:在初始化时保存ApplicationContext对象 方法二:通过Spring提供的utils类获取ApplicationContext对象 方法三:继承自抽象类ApplicationObj ...

  8. Spring在代码中获取bean的几种方式(转)

    获取spring中bean的方式总结: 方法一:在初始化时保存ApplicationContext对象 ApplicationContext ac = new FileSystemXmlApplica ...

  9. 001-Spring在代码中获取bean的几种方式

    一.概述 方法一:在初始化时保存ApplicationContext对象 方法二:通过Spring提供的utils类获取ApplicationContext对象 方法三:继承自抽象类Applicati ...

随机推荐

  1. 分布式blog系统 TFS总结

    解决的问题 文件总量太大  一台服务器无法存放 只能放在网络集群中分节点存放   也就是通过屏蔽网络部分 形成一个“ one big CPU” 和 “one big disk” .Client只需要向 ...

  2. RaphaelJS实践--猫和老鼠矢量图展示

    (目前发现一些文章被盗用的情况,我们将在每篇文章前面添加原文地址,本文源地址:http://www.cnblogs.com/idealer3d/p/tomAndJerryRaphaelVectorGr ...

  3. awk(1)-简述

    1.概述 AWK is a programming language designed for text processing and typically used as a data extract ...

  4. ListView只允许展开其中一个item的方法

    xml文件代码: <?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:an ...

  5. bootstrap-14

    基础导航条: 使用方法:1. 首先在制作导航的列表(<ul class="nav">)基础上添加类名"navbar-nav" 2.在列表外部添加一个 ...

  6. sublime 中文乱码

      一.安装Package Control 使用Sublime Text2首先就要安装Package Control,这样就能使用丰富的插件包了 (1)访问Package Control站点按照提示复 ...

  7. UNITY更新到5后设置的动画无法播放了怎么办

    点击对应的animator,将 apply root motion  这个选项的勾去掉就可以了,纠结了很久最后在UNITY官方论坛找到的答案

  8. HDU 1026 Ignatius and the Princess I(带路径的BFS)

    http://acm.hdu.edu.cn/showproblem.php?pid=1026 题意:给出一个迷宫,求出到终点的最短时间路径. 这道题目在迷宫上有怪物,不同HP的怪物会损耗不同的时间,这 ...

  9. hiho一下123周 后缀数组四·重复旋律

    后缀数组四·重复旋律4 时间限制:5000ms 单点时限:1000ms 内存限制:256MB 描述 小Hi平时的一大兴趣爱好就是演奏钢琴.我们知道一个音乐旋律被表示为长度为 N 的数构成的数列.小Hi ...

  10. 用 windows GDI 实现软光栅化渲染器--gdi3d(开源)

    尝试用windows GDI实现了一个简单的软光栅化渲染器,把OpenGL渲染管线实现了一遍,还是挺有收获的,搞清了以前一些似是而非的疑惑. ----更新2015-10-16代码已上传.gihub地址 ...