首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

JS如何获取所有img src标签

JS可以通过以下几种方式获取所有img src标签:

  1. 使用document.getElementsByTagName方法获取所有img标签,然后遍历获取每个img标签的src属性值。
代码语言:txt
复制
var imgTags = document.getElementsByTagName('img');
var srcList = [];
for (var i = 0; i < imgTags.length; i++) {
  srcList.push(imgTags[i].src);
}
console.log(srcList);
  1. 使用document.querySelectorAll方法结合CSS选择器获取所有img标签,然后遍历获取每个img标签的src属性值。
代码语言:txt
复制
var imgTags = document.querySelectorAll('img');
var srcList = [];
imgTags.forEach(function(img) {
  srcList.push(img.src);
});
console.log(srcList);
  1. 使用jQuery库的选择器功能获取所有img标签,然后遍历获取每个img标签的src属性值。
代码语言:txt
复制
var srcList = [];
$('img').each(function() {
  srcList.push($(this).attr('src'));
});
console.log(srcList);

以上方法可以获取到页面中所有img标签的src属性值,并将其存储在一个数组中。这样可以方便地对这些src进行进一步的处理或使用。

腾讯云相关产品和产品介绍链接地址:

  • 腾讯云官网:https://cloud.tencent.com/
  • 云服务器CVM:https://cloud.tencent.com/product/cvm
  • 云函数SCF:https://cloud.tencent.com/product/scf
  • 云数据库MySQL:https://cloud.tencent.com/product/cdb_mysql
  • 云存储COS:https://cloud.tencent.com/product/cos
  • 人工智能AI:https://cloud.tencent.com/product/ai
  • 物联网IoT Hub:https://cloud.tencent.com/product/iothub
  • 区块链BCS:https://cloud.tencent.com/product/bcs
  • 元宇宙:https://cloud.tencent.com/product/metaspace
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

  • 使用交叉点观察器延迟加载图像以提高性能

    在自己平时浏览一些大量图片类的网站时,你会发现无论是你pc端下拉滚动条,还是移动端手动滑屏时,最终呈现的图片有时候会有所延迟,这是一种预先加载图片资源的方式,也就是俗称懒加载,实现该效果,通常有两种方式,分别是线性式(下拉窗帘式的)和渐进式(拨开晨雾见日明)图片加载,至于前者这里暂且不谈,本文主要是介绍后者,在本文中主要给img标签添加一data-src属性(实际图片URL),以及src属性(存储相同图像的非常小的分辨率路径图片),在加载图片时,给用户过度从模糊淡入到图片清晰,当然更重要的是其中的js处理,如果文有误导的地方,欢迎路过的老师多提意见和指正

    01
    领券