jquery get img src - Javascript (1)

📌 相关文章

📜 jquery get img src - Javascript (1)

📅 最后修改于: 2023-12-03 15:32:08.445000 🧑 作者: Mango

Jquery Get Img Src - Javascript

在网页开发中，有时需要从网页中获取图片的 URL 地址。使用 JQuery 代码可以方便地实现这一功能。

JQuery Get Img Src 方法

以下是获取图片 URL 地址的 JQuery 代码：

$("img").each(function(){
   console.log($(this).attr("src"));
});

代码解释：

$：代表 JQuery 库；
"img"：JQuery 选择器，选择所有 img 元素；
.each()：JQuery 遍历函数，遍历每个 img 元素并执行后续操作；
$(this)：代表每个 img 元素；
.attr()：获取 img 元素的属性值；
"src"：img 元素的 src 属性。

示例

以下是一个 HTML 示例：

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>JQuery Get Img Src</title>
	<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
</head>
<body>
    <img src="https://via.placeholder.com/150" alt="Placeholder image">
    <img src="https://via.placeholder.com/200" alt="Placeholder image">
    <img src="https://via.placeholder.com/250" alt="Placeholder image">
    <img src="https://via.placeholder.com/300" alt="Placeholder image">
    <img src="https://via.placeholder.com/350" alt="Placeholder image">
    <img src="https://via.placeholder.com/400" alt="Placeholder image">
</body>
</html>

使用 JQuery 获取所有图片的 URL：

$("img").each(function(){
   console.log($(this).attr("src"));
});

输出结果：

https://via.placeholder.com/150
https://via.placeholder.com/200
https://via.placeholder.com/250
https://via.placeholder.com/300
https://via.placeholder.com/350
https://via.placeholder.com/400

结论

以上是使用 JQuery 获取图片 URL 的方法。这样，就可以方便地从网页中获取所有图片的地址。