有记 MSNC.CN有记 MSNC.CN
2024-05-26收录 146关注

jquery 循环取img标签中的src

内容来自 MSNC.CN,by ZSY.RED

如何使用 jQuery 循环取 img 标签中的 src

理解需求

在开始编写代码之前,我们首先需要明确我们的需求是什么。我们需要循环遍历页面中的所有 img 标签,并获取每个 img 标签的 src 属性值。

查找 img 标签

在使用 jQuery 进行 DOM 操作之前,我们需要先确保 jQuery 库已经被引入到页面中。

在确保 jQuery 库已经引入的情况下,我们可以通过以下代码来查找页面中的所有 img 标签:

var imgTags = $('img');

这样,我们就得到了一个包含了所有 img 标签的 jQuery 对象。

循环遍历 img 标签

接下来,我们需要对获取到的 img 标签进行循环遍历。我们可以使用 jQuery 的 each 方法来实现循环遍历:

imgTags.each(function() {

    // 在这里进行每个 img 标签的处理

});

在 each 方法的回调函数中,我们可以对每个 img 标签进行处理。

获取 src 属性

在回调函数中,我们可以使用 $(this) 来访问当前正在遍历的 img 标签。然后,我们可以通过 attr 方法来获取 img 标签的 src 属性值:

这样,我们就得到了当前 img 标签的 src 属性值。

处理 src 属性

我们可以在获取到 src 属性值后进行各种操作,比如打印到控制台、保存到数组或进行其他的处理。以下是一个示例,将每个 img 标签的 src 属性打印到控制台:

console.log(src);

完整代码如下所示:

var imgTags = $('img');

imgTags.each(function() {

    var src = $(this).attr('src');

    console.log(src);

});


THE END
MSNC.CN