Jquery遍历节点的方法小集

项目中用到遍历dom节点的操作 很长时间不用了 有点忘记了

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=GBK">
<link rel="stylesheet" type="text/css" href="table.css">
<title></title>
<script src="../jquery-1.7.2.js" type="text/javascript"></script>
<style type="text/css">
</style>
<script type="text/javascript">
$(function()
{
//next()查找下一个紧邻的节点next("#x")查找下一个紧邻的id为x的节点
$("#d4").next().css("background-color","red");
//nextAll()之后的所有节点.之后的所有的div标签nextAll("div")
$("#d4").nextAll().css("background-color","red");
//之前的紧邻节点
$("#d4").prev().css("background-color","red");
//之前的所有节点
$("#d4").prevAll().css("background-color","red");
//查找所有的兄弟节点
$("#d4").siblings().css("background-color","red");
//查找本节点和本节点之后的节点,end()返回上一次jQuery对象被破坏之前的状态
$("#d4").nextAll().css("background-color","red").end().css("background-color","red");
$("#d4").nextAll().andSelf().css("background-color","red");
$("#d4").nextAll().andSelf().end().css("background-color","red");
});
</script>
</head>
<body>
<div>11111111</div>
<div>22222222</div>
<div>33333333</div>
<div id="d4">44444444</div>
 55555555
<div>66666666</div>
<div>77777777</div>
<div>88888888</div>
<div>99999999</div>
</body>
</html> 

顺便附上自己积累的jquery特效

http://download.csdn.net/album/detail/1365

时间: 2024-10-11 11:24:39

Jquery遍历节点的方法小集的相关文章

jQuery遍历之parent()方法

jQuery遍历之parent()方法 jQuery是一个合集对象,如果想快速查找合集里面的每一个元素的父元素(这里可以理解为就是父亲-儿子的关系),此时可以用parent()方法 因为是父元素,这个方法只会向上查找一级 理解节点查找关系: <div class="div"> <ul class="son"> <li class="grandson">1</li> </ul> </

jquery 遍历节点

1.jquery 遍历节点时如果,这些节点是随时更新的就要这样通过选择器获取节点: self.modelSlide.find('li').eq(0).appendTo(self.modelSlide); 2. 当有动画播放时,如果不想点击按钮频繁点击时,要设置开关 self.isclick = false;      //默认是可以点击 self.prevBtn.on('click',function(){ if(self.isclick) return;    //如果他已经存在就让他跳出 s

【转】 jquery遍历json数组方法

$(function () { var tbody = ""; //------------遍历对象 .each的使用------------- //对象语法JSON数据格式(当服务器端回调回来的对象数据格式是json数据格式,必须保证JSON的格式要求,回调的对象必须使用eval函数进行转化(否则将得不到Object).本文不作详细介绍服务器端回调的数据问题,我们将直接自定义对象) var obj = [{ "name": "项海军", &qu

jQuery遍历节点方法汇总

1.children()方法:$('div').children()---遍历查找div元素的所有子元素节点 1 <p>Hello</p> 2 <div> 3 <span>Hello Again</span> 4 <p class="box">您好!</p> 5 </div> 6 <p>And Again</p> 7 8 <script type="t

jquery遍历节点 children(),next(),prev(),siblings()closest()

方法 方法描述 children() 获取匹配元素的 子元素个数(只考虑 儿子 元素) next() 获取 后面紧邻的 同辈元素 prev() 获取 前面 紧邻的 同辈元素 siblings() 获取所有的 同辈元素 closest() 从元素本身开始,逐级向上级元素匹配,并返回最先匹配的祖先元素.(有,只返回一个元素节点.没,返回一个空jquery 对象) $("document").click(function( e ){ //获取点击元素 的 上级li ,将 li的颜色设置为红色

jQuery遍历节点

1.chirldren() HTML: <html> <head></head> <body> <p></p> <ul> <li></li> </ul> </body> </html> jQuery代码: var bodylength=$('body').chirldren().length;  //获取<body>下面的子元素个数,结果为2 var

jQuery插入节点的方法

方法 描述 示例 append() 向每个匹配的元素内部追加内容 HTML代码:<p>我想说:</p> jQuery代码: $("p").append("<b>你好</b>"); 结果: <p>我想说:<b>你好</b></p> appendTo() 将所有匹配的元素追加到指定的元素中 .实际上,使用该方法是颠倒了常规 的$(A).append(B)的操作,是将A追加到B

jQuery遍历之closest()方法

// 从元素本身开始,在DOM 树上逐级向上级元素匹配,并返回最先匹配的祖先元素. // 常用格式: var tbl = $(obj).closest("table"); // 这句js的意思是找到obj对象的第一个table祖先元素,这里的obj可以是tr,tbody,td,td或tr里面的input,等等元素标签. // 例如: $("div").closet("li'); .closest() .parents() 起始位置不同 从当前元素开始 从父

jQuery 遍历用法

jQuery 遍历 DOM 树 parent() 方法返回被选元素的直接父元素. parents() 方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素 . parentsUntil() 方法返回介于两个给定元素之间的所有祖先元素. children() 方法返回被选元素的所有直接子元素. find() 方法返回被选元素的后代元素,一路向下直到最后一个后代. <script> $(document).ready(function(){ $("span").paren