位置: IT常识 - 正文
【前端每日一问002】jquery中each与data方法的用法与概念(前端常问的面试题)
发布时间：2024-01-08推荐整理分享【前端每日一问002】jquery中each与data方法的用法与概念(前端常问的面试题)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:前端每日一题,前端日常,2021前端经典面试题,2021最新前端面试题及答案,2021最新前端面试题及答案,前端日常,前端100问,前端每日一题,内容如对您有帮助，希望把文章链接给更多的朋友！
在 jQuery 中，.each() 方法和 .data() 方法都是常用的工具。这两个方法的用法和概念如下：
🌙一、.each() 方法：.each() 方法是 jQuery 对象的方法，用于遍历匹配元素集合中的所有元素，并对每个元素执行一个回>调函数。该方法的语法如下：
$(selector).each(function(index, element){ // 回调函数});其中，selector 是用于匹配元素的选择器，可以是任何 jQuery 选择器；index 是当前元素在集合中的索引；element 是当前元素的 DOM 对象。
下面是一个使用 .each() 方法的例子，假设有如下 HTML 代码：
<ul id="list"> <li>Apple</li> <li>Banana</li> <li>Cherry</li></ul>
我们可以使用如下代码遍历上述列表中的每个 <li> 元素，并在控制台输出其文本内容：
$('#list li').each(function(index, element) { console.log(index + ': ' + $(element).text());});输出结果如下：
0: Apple1: Banana2: Cherry🌙二、.data()方法：.data() 方法是 jQuery 对象的方法，用于在元素上存储数据，或从元素上读取数据。该方法的语法如下：
存储数据：$(selector).data(key, value);其中，selector 是用于匹配元素的选择器，可以是任何 jQuery 选择器；key 是数据的键名，value >是数据的键值。
读取数据：$(selector).data(key);其中，selector 是用于匹配元素的选择器，可以是任何 jQuery 选择器；key 是要读取的数据的键名。
下面是一个使用 .data() 方法的例子，假设有如下 HTML 代码：
<div id="myDiv">Hello, world!</div>我们可以使用如下代码向 <div> 元素存储一些数据，并从中读取数据：
// 存储数据$('#myDiv').data('name', 'zhou');$('#myDiv').data('age', 3);// 读取数据console.log($('#myDiv').data('name')); // 输出 "zhou"console.log($('#myDiv').data('age')); // 输出 3在上面的例子中，我们使用 .data() 方法向 <div> 元素存储了两个数据，分别是名字和年龄。然后我>们使用 .data() 方法从中读取了这些数据，并输出到控制台中。
上一篇：HTML转EXE工具（HTML App Build）最新版(html转xhtml)
下一篇：红宝石海滩的日落，华盛顿州奥林匹克国家公园 (© Adam Mowery/Tandem Stills + Motion)(红宝石地址)
