当我们需要对一个 HTML 元素数组或对象进行迭代处理时，就可以使用 jQuery 提供的 $.each() 函数。下面是 $.each() 的用法说明：
1. 基本用法：
$.each(obj, function(index, value) {
// 处理代码
})
其中 obj 表示要进行遍历处理的对象或数组；函数中的 index 表示当前遍历的数据的索引值，value 表示当前遍历的数据的值。通过这种方式，我们可以对 obj 中的每个元素进行处理。
2. 示例 - 对数组进行遍历并输出
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery each 示例 - 对数组进行遍历</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<ul id="langList"></ul>
<script>
var languages = ['HTML', 'CSS', 'JavaScript', 'Python'];
$.each(languages, function(index, value) {
$('#langList').append('<li>' + value + '</li>');
});
</script>
</body>
</html>
以上代码中，我们定义了一个数组 languages，然后使用 $.each() 函数遍历每个元素，并将其添加到页面的一个无序列表中。
3. 示例 - 对对象进行遍历并输出
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery each 示例 - 对对象进行遍历</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<ul id="infoList"></ul>
<script>
var infoObj = {
name: '张三',
age: 18,
sex: '男',
phone: '139********'
};
$.each(infoObj, function(key, value) {
$('#infoList').append('<li>' + key + ': ' + value + '</li>');
});
</script>
</body>
</html>
以上代码中，我们定义了一个对象 infoObj，然后使用 $.each() 函数遍历每个属性，并将其添加到页面的一个无序列表中。
综上所述，$.each() 函数可以对数组或对象进行遍历处理，并在其中进行相应的操作，功能十分强大。
本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：jQuery $.each的用法说明 - Python技术站
微信扫一扫 
支付宝扫一扫 