目录
⏹方式1: `$().each()`⏹方式2: `$.each()`⏹方式3: `$().toArray() + for of`⏹方式4: `Array.from() + for of`<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><button id="btn">获取全部div节点</button><hr><div>div1</div><div>div2</div></body><script src="./js/jquery.min.js"></script></html>
⏹方式1:$().each()
适合用来遍历jQuery选中的DOM列表
$('div').each((index, ele) => {console.log(index);console.log(ele);console.log('---------------');});
⏹方式2:$.each()
也可以遍历DOM列表,但是语义化不如方式1
$.each($('div'), (index, ele) => {console.log(index);console.log(ele);console.log('---------------');});
$.each()方式主要用来遍历普通的非DOM列表
const personList = [{id: 1, name: '张三'},{id: 2, name: '李四'}];$.each(personList, (index, item) => {console.log(index);console.log(item);});
⏹方式3:$().toArray() + for of
可以通过$().toArray()方法直接将伪数组转换为数组
for (const [index, ele] of $('div').toArray().entries()) {console.log(index);console.log(ele);console.log('---------------');}
⏹方式4:Array.from() + for of
jQuery选择器得到的是一个伪数组,可以通过Array.from()转换为数组才能遍历
for (const [index, ele] of Array.from($('div')).entries()) {console.log(index);console.log(ele);console.log('---------------');}
