jquery的遍历

遍历

1. js的遍历方式

for(初始化值;循环结束条件;步长)

2. jq的遍历方式

a. jq对象.each(callback)
b. $.each(object, [callback])
c. for...of: jquery 3.0版本之后提供的方式

• js的遍历方式

$(function(){
  // 1.获取所有的ul下的li
  var citys = $("#city li");
  
  // 2.遍历li
  for(var i = 0;  i < citys.length; i++){
    // 获取内容
    alert(i+":"+citys[i].innerHTML)
  } 
})

• jq对象.each(callback)

$(function(){
  // 1.获取所有的ul下的li
  var citys = $("#city li");
  
  // 2.遍历li
  citys.each(function (index,element){
    //3.1获取li对象 第一种方式 this
    //alert(this.innerHTML);

    //3.2 获取li对象 第二种方式，在回调函数中定义参数 index(索引)  element(元素对象)
    //alert(index+":"+element.innerHTML);

    //判断如果是上海则结束循环
    if("上海" == $(element).html()){
      //如果当前function返回为false，则结束循环(break)。
      //如果返回为true，则结束本次循环，继续下次循环(continue)
      return false;
    }
    alert(index+":"+$(element).html());
  })
})

• $.each(object, [callback])方法

// 使用与上面方法大致相同
$(function(){
  var citys = $("#city li");

  $.each(citys,function(){
    alert($(this).html());
  });
})

• for ... of 方式 : jquery 3.0版本之后提供的方式

$(function(){
  var citys = $("#city li");

  for(li of citys){
    alert($(li).html());
  }
})

如有错误或建议欢迎大家指出与评论哈，希望这篇博文能帮助到大家，大家也可以分享给需要的人。

如需转载，请注明出处。https://www.jianshu.com/p/0dac2e536e1f