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 相关文章推荐
点击文章内容处弹出页面代码
Oct 01 Javascript
div浮层,滚动条移动,位置保持不变的4种方法汇总
Dec 11 Javascript
在Node.js中使用HTTP上传文件的方法
Jun 23 Javascript
jQuery hover事件简单实现同时绑定2个方法
Jun 07 Javascript
Javascript中apply、call、bind的巧妙使用
Aug 18 Javascript
详解vue项目首页加载速度优化
Oct 18 Javascript
Vue 路由 过渡动效 数据获取方法
Jul 31 Javascript
解决axios发送post请求返回400状态码的问题
Aug 11 Javascript
layui 选择列表,打勾,点击确定返回数据的例子
Sep 02 Javascript
javascript随机变色实例代码
Oct 15 Javascript
vue的hash值原理也是table切换实例代码
Dec 14 Vue.js
在 HTML 页面中使用 React的场景分析
Jan 18 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
PHP图片上传代码
2013/11/04 PHP
PHP封装的一个支持HTML、JS、PHP重定向的多功能跳转函数
2014/06/19 PHP
php用正则判断是否为数字的方法
2016/03/25 PHP
注释PHP和html混合代码的小技巧(分享)
2016/11/03 PHP
Thinkphp结合ajaxFileUpload实现异步图片传输示例
2017/03/13 PHP
php+ajax 文件上传代码实例
2019/03/18 PHP
Display SQL Server Version Information
2007/06/21 Javascript
基于jquery自定义的漂亮单选按钮RadioButton
2013/11/19 Javascript
Javascript图片上传前的本地预览实例
2014/06/16 Javascript
Fullpage.js固定导航栏-实现定位导航栏
2016/03/17 Javascript
javascript中利用柯里化函数实现bind方法
2016/04/29 Javascript
webpack配置的最佳实践分享
2017/04/21 Javascript
[06:45]2018DOTA2亚洲邀请赛 4.5 SOLO赛 Sccc vs Maybe
2018/04/06 DOTA
python以环状形式组合排列图片并输出的方法
2015/03/17 Python
不要用强制方法杀掉python线程
2017/02/26 Python
python频繁写入文件时提速的方法
2019/06/26 Python
django框架事务处理小结【ORM 事务及raw sql,customize sql 事务处理】
2019/06/27 Python
使用python画社交网络图实例代码
2019/07/10 Python
django框架ModelForm组件用法详解
2019/12/11 Python
python实现根据给定坐标点生成多边形mask的例子
2020/02/18 Python
pytorch __init__、forward与__call__的用法小结
2021/02/27 Python
美国家具网站:Cymax
2016/09/17 全球购物
Muziker英国:中欧最大的音乐家商店
2020/02/05 全球购物
C#中的验证控件有几种
2014/03/08 面试题
Solaris操作系统的线程机制
2015/07/28 面试题
幼儿园实习自我鉴定
2013/12/15 职场文书
水利学院求职自荐书
2014/02/01 职场文书
高中生学期学习自我评价
2014/02/24 职场文书
2014年社区植树节活动方案
2014/02/28 职场文书
人力资源总监工作说明
2014/03/03 职场文书
售后客服个人自我评价
2014/09/14 职场文书
安全责任书
2015/01/29 职场文书
人事行政部各岗位职责说明书!
2019/07/15 职场文书
MongoDB支持的数据类型
2022/04/11 MongoDB
Python用any()函数检查字符串中的字母以及如何使用all()函数
2022/04/14 Python
MySQL自定义函数及触发器
2022/08/05 MySQL