本文介绍JavaScript获取HTML页面图片地址的两种主要方法：使用正则表达式解析HTML字符串，以及利用jQuery的find与attr方法。重点讨论了获取图片src时相对路径与完整URL的区别，并通过示例演示如何剥离域名前缀以获取纯相对路径。
正则表达式提取图片地址
第一种方案：利用JavaScript正则表达式进行提取
/**
* 获取html代码中图片地址
* @param htmlstr
* @returns {Array}
*/
function getimgsrc(htmlstr) {
var reg = /<img.+?src=('|")?([^'"]+)('|")?(?:\s+|>)/gim;
var arr = [];
while (tem = reg.exec(htmlstr)) {
arr.push(tem[2]);
}
return arr;
}jQuery获取图片路径
第二种方案：基于jQuery库实现
var img = $(this).find("img").attr("src");//这个是获得相对路径 prospertu
//alert($(this).find("img").prop("src"));这个是获得完整路径 包括http://处理相对路径与完整URL
JavaScript在获取图片src属性时遇到相对路径的情况
JavaScript在获取src属性时可能同时包含域名信息；例如图片路径为mall/kmenus/001.png，通过obj.src或.prop("src")可获取到http://localhost/mall/kmenus/001.png，但通常仅需相对路径即可。特此记录。
<img src="mall/kmenus/001.png" onclick="showSelected(this)">
function showSelected(obj)
{
var rootpath='http://localhost/';
res=obj.src.replace(rootpath,'');
//分离路径和图片
document.getElementById("cate_img_src").src=obj.src;
}本文介绍至此，有需要的朋友可以参考学习。