【天天新要闻】jquery有哪些遍历方法

<script src="js/jquery-1.10.2.min.js"></script><script>$(document).ready(function() {$("button").on("click", function() {$("ul").find("*").css({"color": "red","border": "2px solid red"});});});</script>
div (父节点)
ul (指定元素)
li (子节点1)span (孙节点1)
li (子节点2)span (孙节点2)
li (子节点3)span (孙节点3)
选取ul的所有子元素

<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
Hello
Hello Again
And Again
<script>$("p").siblings(".selected").css("background", "yellow");</script>

<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
list item 1
list item 2
list item 3
list item 4
list item 5
<script>$("li.third-item").next().css("background-color", "red");</script>

<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
list item 1
list item 2
list item 3
list item 4
list item 5
<script>$("li.third-item").nextAll().css("background-color", "red");</script>

<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script><script>$(document).ready(function() {$("li.start").nextUntil("li.stop").css({"color": "red","border": "2px solid red"});});</script>
ul (父节点)
li (兄弟节点)
li (兄弟节点)
li (类名为"start"的兄弟节点)
li (类名为"start"的li节点的下一个兄弟节点)
li (类名为"start"的li节点的下一个兄弟节点)
li (类名为"start"的li节点的下一个兄弟节点)
li (类名为"stop"的兄弟节点)
在这个例子中,我们返回在类名为“star”和类名为“stop”的 li元素之间的所有下一个兄弟元素。

<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script><script>$(document).ready(function() {$("li.start").prev().css({"color": "red","border": "2px solid red"});});</script>
ul (父节点)
li (兄弟节点)
li (类名为"start"的li节点的上一个兄弟节点)
li (类名为"start"的li节点)
li (兄弟节点)
li (兄弟节点)

<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script><script>$(document).ready(function() {$("li.start").prevAll().css({"color": "red","border": "2px solid red"});});</script>
ul (parent)
li (类名为"start"的li的上一个兄弟节点)
li (类名为"start"的li的上一个兄弟节点)
li (类名为"start"的li的上一个兄弟节点)
li (类名为"start"的li节点)
li (兄弟节点)
li (兄弟节点)
在这个例子中,我们返回类名称为“star”的li元素之前的所有兄弟元素。

<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script><script>$(document).ready(function() {$("li.start").prevUntil("li.stop").css({"color": "red","border": "2px solid red"});});</script>
ul (父节点)
li (类名为"stop"的兄弟节点)
li (类名为"start"的li节点的上一个兄弟节点)
li (类名为"start"的li节点的上一个兄弟节点)
li (类名为"start"的li节点的上一个兄弟节点)
li (类名为"start"的li节点)
li (兄弟节点)
li (兄弟节点)
在这个例子中,我们返回在类名为“star”和“stop”的li元素之间的所有上一个兄弟元素,。

<script>var arr = [1,3,5,7,9];var obj = {0:1,1:3,2:5,3:7,4:9};/*** 利用jQuery的each静态方法遍历* 第一个参数：当前遍历到的索引* 第二个元素：遍历到的元素* 注意：jQuery的each方法可以遍历伪数组*/$.each(arr,function(index,value){console.log("jQuery-each方法遍历数组：",index,value);})$.each(obj,function(index,value){console.log("jQuery-each方法遍历伪数组：",index,value);})</script>

<script>var arr = [1,3,5,7,9];var obj = {0:1,1:3,2:5,3:7,4:9};/***1.利用原生JS的map方法遍历 *第一个参数：遍历到的元素*第二个参数：当前遍历到的索引*第三个参数：当前被遍历的数组*注意：和原生的forEach方法一样，不能遍历伪数组*/arr.map(function(value,index,array){console.log("原生map遍历数组:",index,value,array);});/**obj.map(function(value,index,array){console.log("原生map遍历伪数组:",index,value,array);//Uncaught TypeError: obj.forEach is not a function});*//*** 2.利用jQuery的each静态方法遍历* 第一个参数：要遍历的数组* 每遍历一个元素之后执行的回调函数* 回调函数的参数：* 第一个参数：遍历到的元素* 第二个元素：当前遍历到的索引* 注意：和jQuery的each方法一样可以遍历伪数组*/$.map(arr,function(value,index){console.log("jQuery-map方法遍历数组：",index,value);})$.map(obj,function(value,index){console.log("jQuery-map方法遍历伪数组：",index,value);})</script>

复制代码 var arr = [ "one", "two", "three", "four"];      $.each(arr, function(){         alert(this);      });   //上面这个each输出的结果分别为：one,two,three,four        var arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]]     $.each(arr1, function(i, item){        alert(item[0]);     });     //其实arr1为一个二维数组，item相当于取每一个一维数组，   //item[0]相对于取每一个一维数组里的第一个值   //所以上面这个each输出分别为：1   4   7         var obj = { one:1, two:2, three:3, four:4};     $.each(obj, function(i) {         alert(obj[i]);           });   //这个each就有更厉害了，能循环每一个属性     //输出结果为：1   2  3  4

<script type="text/javascript" src="/jquery/jquery.js"></script><script type="text/javascript">$(document).ready(function(){  $("button").click(function(){    $("li").each(function(){      alert($(this).text())    });  });});</script>输出每个列表项的值
Coffee
Milk
Soda

$(function(){    var arr = [];    $(":checkbox").each(function(index){        arr.push(this.id);    });    var str = arr.join(",");    alert(str);})

$(function(){    var str = $(":checkbox").map(function() {        return this.id;    }).get().join();        alert(str);})

$.each( [0,1,2], function(i, n){alert( "Item #" + i + ": " + n );});

$.each( { name: "John", lang: "JS" }, function(i, n){alert( "Name: " + i + ", Value: " + n );});

$.each($("input:hidden"), function(i,val){alert(val); //输出[object HTMLInputElement]，因为它是一个表单元素。alert(i); //输出索引为0，1，2，3alert(val.name); //输出name的值alert(val.value); //输出value的值});

    
        
          
嗨，第一层评论
          
            回复          
        
        
          
            
            
第二层评论
            
              回复            
          
        
    

$("div.reply").hover(function(){  $(this).find(".comment-reply-link").show();},function(){  $(this).find(".comment-reply-link").hide();});

                
                1.  阿斯顿按时请选择                                
                                                
                                A         .阿萨德发                                
                                                    
                                B         .阿萨德发                                
                                                    
                                C         .阿斯顿                                
                                        
                                
            
        

//验证单选题是否选中        $("ul#ulSingle>li.liStyle").each(function (index) {            //选项个数            var count = $(this).find("ul>li>:checkbox").length;            var selectedCount = 0            for (var i = 0; i < count; i++) {                if ($(this).find("ul>li>:checkbox:eq(" + i + ")").attr("checked")) {                    selectedCount++;                    break;                }            }            if (selectedCount == 0) {                $(this).find("label#selectTips").show();                return false;            }            else {                $(this).find("label#selectTips").hide();            }        })

jQuery.each(object, [callback])