遍历
js的遍历方式
for（初始化值；循环结束条件；步长）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="../js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
/*
遍历
js的遍历方式
for（初始化值；循环结束条件；步长）
jq的遍历方式
jq对象.each（callback）
$.each（object，[ callback ] ）
for..of ：
*/
$(function () {
//1.获取所有的ul下的li
let city = $("#city li");
//2.遍历li
for (let i = 0; i < city.length; i++) {
//获取内容
alert(i+":"+city[i].innerHTML);
}
});
</script>
</head>
<body>
<ul id="city">
<li>北京</li>
<li>上海</li>
<li>天津</li>
<li>重庆</li>
</ul>
</body>
</html>
jq的遍历方式
jq对象.each（callback）
$.each（object，[ callback ] ）
for..of ：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="../js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
/*
遍历
js的遍历方式
for（初始化值；循环结束条件；步长）
jq的遍历方式
jq对象.each（callback）
$.each（object，[ callback ] ）
for..of ：
*/
$(function () {
//1.获取所有的ul下的li
let city = $("#city li");
//2.遍历li
// for (let i = 0; i < city.length; i++) {
// if ("上海"== city[i].innerHTML){
// //break; //结束循环
// continue; // 结束本次循环，继续下次循环
// }
// //获取内容
// alert(i+":"+city[i].innerHTML);
// }
//2.jq对象.each（callback）
city.each(function (index,element) {
//3.1获取li对象 第一种方式 this
//alert(this.innerHTML);
//alert($(this).html());
//3.2获取li对象 第二种方式 在回调函数中定义参数 index(索引) element(元素对象)
//alert(index + ":" + element.innerHTML);
//转换jq
//alert(index + ":" + $(element).html());
if ("上海" == $(this).html()){
// 如果当前function返回为false，则结束循环(break)，
// 如果返回为true，则结束本次循环，继续下次循环(continue)
return true;
}
alert(index + ":" + $(element).html());
});
});
</script>
</head>
<body>
<ul id="city">
<li>北京</li>
<li>上海</li>
<li>天津</li>
<li>重庆</li>
</ul>
</body>
</html>
------------恢复内容结束------------
标签：JQuery,city,遍历,jq,li,each,alert From： https://www.cnblogs.com/qihaokuan/p/17083448.html