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 相关文章推荐
二级域名或跨域共享Cookies的实现方法
Aug 07 Javascript
js电信网通双线自动选择技巧
Nov 18 Javascript
jQuery 剧场版 你必须知道的javascript
May 27 Javascript
IE Firefox 使用自定义标签的区别
Oct 15 Javascript
JavaScript编程的10个实用小技巧
Apr 18 Javascript
与Math.pow 相反的函数使用介绍
Aug 04 Javascript
jQuery中prepend()方法用法实例
Dec 25 Javascript
JSON格式的键盘编码对照表
Jan 29 Javascript
jQuery实现渐变下拉菜单的简单方法
Mar 11 Javascript
react系列从零开始_简单谈谈react
Jul 06 Javascript
JavaScript反弹动画效果的实现代码
Jul 13 Javascript
使用webpack搭建vue环境的教程详解
Dec 31 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 水平的题目
2007/05/30 PHP
PHP 组件化编程技巧
2009/06/06 PHP
phpmyadmin配置文件现在需要绝密的短密码(blowfish_secret)的2种解决方法
2014/05/07 PHP
ThinkPHP中数据操作案例分析
2015/09/27 PHP
PHP实现求两个字符串最长公共子串的方法示例
2017/11/17 PHP
PHP array_reduce()函数的应用解析
2018/10/28 PHP
爱恋千雪-US-AscII加密解密工具(网页加密)下载
2007/06/06 Javascript
js form action动态修改方法
2008/11/04 Javascript
一些常用的JS功能函数(2009-06-04更新)
2009/06/04 Javascript
JavaScript取得鼠标绝对位置程序代码介绍
2012/09/16 Javascript
jquery操作checkbox实现全选和取消全选
2014/05/02 Javascript
jquery+php实现搜索框自动提示
2014/11/28 Javascript
JQuery显示隐藏页面元素的方法总结
2015/04/16 Javascript
jQueryUI Datepicker组件设置日期高亮
2016/10/13 Javascript
微信小程序如何获知用户运行小程序的场景教程
2017/05/17 Javascript
vue v-model表单控件绑定详解
2017/05/17 Javascript
vue+vuex+axios+echarts画一个动态更新的中国地图的方法
2017/12/19 Javascript
jQuery实现适用于移动端的跑马灯抽奖特效示例
2019/01/18 jQuery
[45:59]完美世界DOTA2联赛PWL S2 FTD vs GXR 第二场 11.22
2020/11/24 DOTA
python中MySQLdb模块用法实例
2014/11/10 Python
python中xrange用法分析
2015/04/15 Python
Python中map和列表推导效率比较实例分析
2015/06/17 Python
Python 字典与字符串的互转实例
2017/01/13 Python
关于Python作用域自学总结
2019/06/10 Python
由面试题加深对Django的认识理解
2019/07/19 Python
基于python及pytorch中乘法的使用详解
2019/12/27 Python
tensorflow 重置/清除计算图的实现
2020/01/19 Python
CSS3五个技巧给你的网站带来出色的效果
2009/04/02 HTML / CSS
基于html和CSS3制作酷炫的导航栏
2015/09/23 HTML / CSS
用html5的canvas画布绘制贝塞尔曲线完整代码
2013/08/14 HTML / CSS
佳能加拿大网上商店:Canon eStore Canada
2018/04/04 全球购物
教育学专业毕业生的自我评价
2013/11/21 职场文书
餐饮业创业计划书范文
2014/01/06 职场文书
2015年美容师个人工作总结
2015/10/14 职场文书
外出学习心得体会范文
2016/01/18 职场文书
Redis入门基础常用操作命令整理
2022/06/01 Redis