js获取html页面代码中图片地址的实现代码

在HTML中的图片地址时，JavaScript可以发挥巨大的作用。以下是一个简单且实用的指南，介绍如何使用JavaScript获取HTML代码中的图片地址。对于需要的朋友，这里提供两种常见的方法供参考。

方法一：使用正则表达式

在JavaScript中，我们可以通过编写一个正则表达式函数来获取HTML字符串中的所有图片地址。这个函数会搜索HTML字符串中的``标签，并提取出`src`属性中的值。具体实现如下：

```javascript

function getimgsrc(htmlstr) {

var reg = /)/gim; // 正则表达式匹配img标签的src属性

var arr = []; // 用于存储图片地址的数组

var tem; // 用于存储正则匹配的结果

// 使用while循环和exec方法遍历匹配结果

while (tem = reg.exec(htmlstr)) {

arr.push(tem[2]); // 将匹配到的图片地址添加到数组中

}

return arr; // 返回包含所有图片地址的数组

}

```

方法二：使用jQuery

如果你正在使用jQuery库，那么获取图片地址会更为简单。可以通过选择器直接获取图片的`src`属性。例如：

```javascript

var imgSrc = $(this).find("img").attr("src"); // 获取当前元素下所有img标签的src属性（相对路径）

```

或者使用`.prop()`方法来获取完整的图片路径，包括协议头（如

```javascript

var fullImgSrc = $(this).find("img").prop("src"); // 获取完整的图片路径

```

请注意，js在获取图片的`src`时通常会得到完整的URL路径，包括协议头（如

```javascript

function showSelected(obj) {

var rootpath = ' // 域名或基础路径

var imgPath = obj.src; // 获取完整路径

var relativePath = imgPath.replace(rootpath, ''); // 替换掉基础路径得到相对路径

// 进行其他操作，如设置其他图片的src属性等

document.getElementById("cate_img_src").src = obj.src; // 设置其他元素的图片源为选中的图片完整路径

}

```

以上代码片段演示了如何在点击``标签时获取其完整路径，并提取出相对路径。这样可以根据需求进行进一步处理。这篇文章提供的这些方法希望能对需要的朋友有所帮助。如有更多疑问或需求，欢迎进一步。