js获取html图片路径正则表达式,js获取图片的路径及文件名

本文介绍了一种通过JavaScript获取网页中图片的完整路径及图片名称的方法。利用自定义函数GetImgName()从图片路径中提取文件名,适用于前端开发场景。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

假如网页中有一图片,那么如何得知该图片的路径及图片名称呢?请使用下面的JS代码来解决你的问题。

一、图片信息

var img=new Image();

img.id="MyImg";

img.src="MyCamera.png";

二、获取图片信息

①获取图片的完整路径

alert(img.src);

②获取图片的名称

该功能得使用函数来解决。

function GetImgName(path)

{

var filename;

if(path.indexOf("/")>0)//如果包含有"/"号 从最后一个"/"号+1的位置开始截取字符串

{

filename=path.substring(path.lastIndexOf("/")+1,path.length);

}

else

{

filename=path;

}

return filename;

}

上面是自定义函数,如此调用即可。

alert(GetImgName(img.src));

效果如下图。

b2767cc601cb3c1672939561286fa696.png

网站`jocydm.com`并使用正则表达式解析网页获取图片的过程通常涉及以下几个步骤: 1. **发送请求**:首先,你需要使用Python的`requests`库发送HTTP请求到目标页面,获取HTML源码。 ```python import requests url = "https://jocydm.com" # 替换为你想要爬的页面地址 response = requests.get(url) html_content = response.text ``` 2. **分析HTML**:然后,你可以使用`re`模块(正则表达式)来查找图片标签 `<img>` 中的src属性,该属性通常包含了图片链接。注意,有些网站可能会使用JavaScript动态加载图片,这时正则表达式可能不够精确,需要结合其他技术(如Selenium)。 ```python import re pattern = r'<img[^>]+src=["\']([^"\'>]+)["\']' image_links = re.findall(pattern, html_content) ``` 3. **下载图片**:找到所有图片链接后,你可以遍历它们,使用`requests`再次下载,并保存到本地。 ```python import os from PIL import Image # 可能需要安装PIL库处理图片 def download_image(img_url, save_dir): img_data = requests.get(img_url).content with open(os.path.join(save_dir, os.path.basename(img_url)), 'wb') as f: f.write(img_data) save_dir = "images" # 图片保存路径 if not os.path.exists(save_dir): os.makedirs(save_dir) for link in image_links: download_image(link, save_dir) ``` 4. **添加注释**:如果你想给每个图片添加描述性的注释,可以在下载前通过HTML解析得到alt属性(如果存在的话),或者直接在本地文件名上添加注释。这一步决于原始HTML的具体结构。 ```python alt_pattern = r'<img[^>]+alt=["\']([^"\'>]+)["\']' alt_text = re.findall(alt_pattern, html_content) for i, link in enumerate(image_links): alt = alt_text[i] if alt_text else f"Image {i+1}" download_image(link, os.path.join(save_dir, f"{alt}.jpg")) ``` 请注意,网站可能有反爬虫策略,爬时需尊重网站的Robots协议,避免对服务器造成过大压力。如果你遇到JavaScript动态加载的情况,可能需要切换到更专业的网络抓包工具,比如Selenium配合浏览器驱动。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值