jQuery之使用each方法遍历对象

jquery的隐式迭代会对所有的DOM对象设置相同的值,但是如果我们需要给每一个对象设置不能的值得时候,就需要自己进行迭代了

each方法

$(selector).each(function(index,element){})

each()方法中可传入一个函数,函数中可以传两个参数

参数1:表示当前元素在所有匹配元素中的索引号

参数2:表示当前元素(DOM)

案例:给不同的li设置不同的透明度
 <div>
      <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>
        <li>7</li>
        <li>8</li>
        <li>9</li>
        <li>10</li>
      </ul>
    </div>

    // 方法1:
    for(let i = 0;i<$('li').length;i++){
    
    
      $('li').eq(i).css('opacity',(i+1)/10);
    }

    // 方法2:(推荐)
    $('li').each(function(index,element){
    
    
      $(element).css('opacity',(index+1)/10)
    })
web前端交流QQ群:327814892

猜你喜欢

转载自blog.csdn.net/qq_43327305/article/details/103241436