jQuery 遍历each()的使用方法

.each()是一个for循环的包装迭代器
.each()经过回调的方式处理，而且会有2个固定的实参，索引与元素(从0开始计数)
.each()回调方法中的this指向当前迭代的dom元素

遍历方法：

<div class="left first-div">
    <div class="div">
        <ul>
            <li>111111111111</li>
            <li>22222222222</li>
            <li>3333333333</li>
        </ul>
    </div>
    <div class="div">
        <ul>
            <li>4444444444</li>
            <li>555555555</li>
            <li>666666666</li>
        </ul>
    </div>
</div>

<br/>
<button class="click">遍历元素</button>

<style> .left { width: auto; height: 150px;
    } .left div { width: 150px; height: 120px; padding: 5px; margin: 5px; float: left; background: #bbffaa; border: 1px solid #ccc;
    } </style>

<script type="text/javascript"> $(".click").click(function() { $("li").each(function(index, element) { //遍历全部的li
            $(this).css('color','red') //修改每一个li内的字体颜色
 }) }) </script>

效果图：

 

回调函数方法：

div和样式跟以前遍历的同样

<button class="click">回调判断</button>

<script type="text/javascript"> $(".click").click(function() { $("li").each(function(index, element) { //遍历全部的li
            if (index % 2) {  //修改偶数li内的字体颜色
                $(this).css('color','blue') } }) }) </script>

效果图：