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"); })

　　推荐阅读

　　JS模拟面向对象全解（二、类型与赋值）

类型赋值类似变量传递的问题。 基本数据类型不必说，传值的。 复制代码 代码如下: var a=5; var b=a; b=3; alert(a);//提示5 alert(b);//提示3 由此观之，发现改变b不会改变a，因为都是变量的值在来回传递，和变量>>>详细阅读

本文标题：jquery中获取元素的几种方式小结

地址：http://www.17bianji.com/kaifa2/JS/24422.html

 1/2    1