jQuery实战：遍历、获取与设置属性

"这篇jQuery学习笔记主要探讨了如何利用jQuery控制页面实现各种功能，包括each()方法用于遍历元素，以及获取和设置属性的attr()方法。通过示例代码，作者详细展示了这些功能的用法，并提供了实际操作的场景。" 在jQuery中，`each()`方法是一个非常重要的工具，它允许我们遍历DOM中的元素集合。在提供的代码示例中，`$(“div”)`选择了所有的`div`元素，然后通过`.each()`函数对它们进行迭代。在回调函数中，`index`参数表示当前元素在集合中的位置，`$(this)`则引用当前遍历到的元素。通过改变`$(this).html()`，我们可以更新每个`div`的内容，如将"这是第[index]个div"插入到对应的`div`中。 另一个关键知识点是`attr()`方法，它用于获取或设置HTML元素的属性。在获取属性值的代码段中，`$(this).attr(“title”)`返回当前元素的`title`属性值，并在警告框中显示。而设置属性值时，可以使用`attr(name, value)`形式，如将所有`div`的样式设置为红色。此外，`attr(name, fn)`形式允许我们提供一个函数来动态设定属性值，例如根据索引生成唯一的`id`。 在`attr(name,fn)`的示例中，`$(this).attr(“id”, function(){...})`为每个`div`创建了一个唯一的`id`，`id`值基于元素在集合中的索引，如"div-id0"、"div-id1"等。同时，`html()`方法被用来更新`div`的内容，展示其新生成的`id`。 通过这些例子，我们可以看到jQuery如何简化了JavaScript中的DOM操作，使得遍历元素、获取和设置属性变得更为便捷。在实际开发中，`each()`和`attr()`是jQuery中常用的功能，它们极大地提高了代码的可读性和效率。对于学习jQuery的初学者来说，理解并熟练运用这两个方法是至关重要的。