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


Posted in Javascript onMarch 05, 2018

第一种方法:js通过正则实现

/** 
 * 获取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实现

var img = $(this).find("img").attr("src");//这个是获得相对路径 prospertu
        //alert($(this).find("img").prop("src"));这个是获得完整路径 包括http://

js在获取图片的src是相对路径

js在获取src时或同时获取到域名路径;如图片路径是mall/kmenus/001.png,用obj.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;
}

这篇文章就介绍到这,需要的朋友可以参考一下。

Javascript 相关文章推荐
Highslide.js是一款基于js实现的网页中图片展示插件
Mar 30 Javascript
javascript 命名空间以提高代码重用性
Nov 13 Javascript
IE FF OPERA都可用的弹出层实现代码
Sep 29 Javascript
asm.js使用示例代码
Nov 28 Javascript
jQuery中wrapInner()方法用法实例
Jan 16 Javascript
深入理解JavaScript系列(28):设计模式之工厂模式详解
Mar 03 Javascript
文件上传的几个示例分享【推荐】
Dec 16 Javascript
Angular 5.0 来了! 有这些大变化
Nov 15 Javascript
轻量级富文本编辑器wangEditor结合vue使用方法示例
Oct 10 Javascript
vue中使用cookies和crypto-js实现记住密码和加密的方法
Oct 18 Javascript
mpvue 单文件页面配置详解
Dec 02 Javascript
浅谈鸿蒙 JavaScript GUI 技术栈
Sep 17 Javascript
vue axios 在页面切换时中断请求方法 ajax
Mar 05 #Javascript
node.js通过axios实现网络请求的方法
Mar 05 #Javascript
axios发送post请求springMVC接收不到参数的解决方法
Mar 05 #Javascript
基于vue 添加axios组件,解决post传参数为null的问题
Mar 05 #Javascript
解决vue处理axios post请求传参的问题
Mar 05 #Javascript
解决vue2中使用axios http请求出现的问题
Mar 05 #Javascript
在vue项目中引入highcharts图表的方法(详解)
Mar 05 #Javascript
You might like
这部番真是良心,画质好到像风景区,剧情让人跟着小公会热血沸腾
2020/03/10 日漫
CPU步进是什么意思?i3-9100F B0步进和U0步进区别知识科普
2020/03/17 数码科技
PHP 中检查或过滤IP地址的实现代码
2011/11/27 PHP
关于shopex同步ucenter的redirect问题,导致script不运行
2013/04/10 PHP
实用的PHP带公钥加密类分享(每次加密结果都不一样哦)
2014/08/20 PHP
PHP 实现类似js中alert() 提示框
2015/03/18 PHP
使用laravel和ECharts实现折线图效果的例子
2019/10/09 PHP
PHP autoload使用方法及步骤详解
2020/09/05 PHP
javascript 密码强度验证规则、打分、验证(给出前端代码,后端代码可根据强度规则翻译)
2010/05/18 Javascript
jsPDF导出pdf示例
2014/05/02 Javascript
控制台报错object is not a function的解决方法
2014/08/24 Javascript
BootStrap实现轮播图效果(收藏)
2016/12/30 Javascript
vue 全选与反选的实现方法(无Bug 新手看过来)
2018/02/09 Javascript
[06:38]DOTA2怒掀电竞风暴 2013Chinajoy
2013/07/27 DOTA
python list 合并连接字符串的方法
2013/03/09 Python
python清除字符串里非数字字符的方法
2015/07/02 Python
1分钟快速生成用于网页内容提取的xslt
2018/02/23 Python
对Tensorflow中的变量初始化函数详解
2018/07/27 Python
Pytorch之contiguous的用法
2019/12/31 Python
Python 安装 virturalenv 虚拟环境的教程详解
2020/02/21 Python
python根据字典的键来删除元素的方法
2020/08/16 Python
python实现感知机模型的示例
2020/09/30 Python
Python创建文件夹与文件的快捷方法
2020/12/08 Python
css3实现背景动态渐变效果
2019/12/10 HTML / CSS
文秘专业毕业生就业推荐信
2013/11/08 职场文书
毕业自我评价范文
2013/11/17 职场文书
医学专业毕业生个人求职信
2013/12/25 职场文书
工作表扬信的范文
2014/01/10 职场文书
大学生就业自荐书
2014/06/16 职场文书
化工实习心得体会
2014/09/09 职场文书
授权委托书(法人单位用)
2014/09/29 职场文书
党的群众路线教育实践活动个人整改落实情况汇报
2014/10/28 职场文书
琅琊山导游词
2015/02/05 职场文书
2015年计划生育责任书
2015/05/08 职场文书
高一作文之暖冬
2019/11/09 职场文书
基于Apache Hudi在Google云构建数据湖平台的思路详解
2022/04/07 Servers