js脚本 将本地图片路径转换为html
公司业务类似于电商, 因此有很多纯图片展示的商品详情页, 类似淘宝店商品页面下的多个图片组成的商品详情页,
页面很简单, 就是一大串img标签, 但是每次做详情页都要配合emmet一顿操作( 如下图 )

(大致操作就是, shift+右键复制文件路径, 然后编辑器里截取文件名, 再配合emmet导成img标签)
偶尔做一次还好, 经常做这类详情页就感觉很麻烦了.
于是乎写了个js脚本一键批量导出为img标签,
git repo地址: https://github.com/Skura23/path-to-img
git demo地址: https://skura23.github.io/path-to-img/
使用很简单, 前缀栏输入公共路径部分, 路径栏输入在本地选中多个图片 shift+右键 选择 复制为路径 获得的图片绝对路径
js比较简单, 但是帮我节省了很多时间, 分享出来, 有需要的童鞋可以使用
本文地址:http://www.cnblogs.com/skura23/p/8617322.html
js脚本 将本地图片路径转换为html的更多相关文章
- Atitit. IE8.0 显示本地图片预览解决方案 img.src=本地图片路径无效的解决方案
Atitit. IE8.0 显示本地图片预览解决方案 img.src=本地图片路径无效的解决方案 1. IE8.0 显示本地图片 img.src=本地图片路径无效的解决方案1 1.1. div来完成 ...
- 如何在vue中使用动态使用本地图片路径
不知道各位小伙伴有没有在开发遇到一个问题,就是在线上的项目使用后台返回本地图片路径,然后加载不上的情况呢? 我的解决方法就是:先在项目的data下定义好这样一个数组用于存放需要加载的路径 [ {nam ...
- js上传本地图片遇到的问题
1.改变页面文件上传默认的样式 <input type="text" size="20" id="upfile" style=&quo ...
- 一段上传图片预览JS脚本,Input file图片预览的实现
在深圳做项目的时候,需要一个用户上传头像预览的功能!是在网上找了好多,都不太满意.要么是flash的,要么是Ajax上传后返回图片路径的,要么压根就是不能用的.幸运的是在这个项目以前有人写过一个图片预 ...
- js小工具---本地图片转换为base64编码数据
今天用jmeter对图片对比进行性能测试,post请求为json请求,图片为Base64编码后的图片数据.所以需要将一张本地图片生成base64编码,找到一个js小工具,记录在这儿便于以后复用. 效果 ...
- 利用js加载本地图片预览功能
直接上代码: 经测试,除safari6包括6以下不支持,其他均可正常显示. 原因:safari6不支持filereader,同时不能使用IE滤镜导致失效. fix: 可以利用canvas,解决safa ...
- 读取sd卡下图片,由图片路径转换为bitmap
public Bitmap convertToBitmap(String path, int w, int h) { BitmapFactory.Options opts = ...
- 上传图片预览JS脚本 Input file图片预览的实现示例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js利用正则替换图片路径问题
/* * 需求:给图片的src地址前面增加为assets * * 1. 将需要匹配的内容原封不动的写入正则表达式 * 2. 将改变的内容替换为.*? * 3. 将.*?添加(),目的是为了能够将src ...
随机推荐
- 深入浅出的webpack构建工具--webpack4+vue搭建环境 (十三)
深入浅出的webpack构建工具--webpack4+vue搭建环境 (十三) 从上面一系列的webpack配置的学习,我们现在来使用webpack来搭建vue的开发环境.首先我们来设想下我们的项目的 ...
- 201904:Action recognition based on 2D skeletons extracted from RGB videos
论文标题:Action recognition based on 2D skeletons extracted from RGB videos 发表时间:02 April 2019 解决问题/主要思想 ...
- 【Codeforces 1132F】Clear the String
Codeforces 1132 F 题意:给一个串\(S\),问每次删除连续的一段相同字母,最少删几次将原串删空. 思路:考虑区间\(dp\),我们看要删多少次能把\([l,r]\)删空,那么最终答案 ...
- Vue-详解设置路由导航的两种方法: <router-link :to="..."> 和router.push(...)
一.<router-link :to="..."> to里的值可以是一个字符串路径,或者一个描述地址的对象.例如: // 字符串 <router-link to= ...
- Ionic下的JPush缺少统计代码问题解决方法
用Ionic打包apk后安装到手机,收到缺少统计代码的提示,解决方法如下: 1. 找到了 platforms/android/src/com/ionichina/ioniclub/MainActiov ...
- BJOI2018简要题解
BJOI2018简要题解 D1T1 二进制 题意 pupil 发现对于一个十进制数,无论怎么将其的数字重新排列,均不影响其是不是 \(3\) 的倍数.他想研究对于二进制,是否也有类似的性质. 于是他生 ...
- OLED小记
1.点阵组成OLED,OLED中有一个GRAM区域,区域中的值直接刷新到屏幕上,对应关系是1bit对应一个像素点: 2.要点亮一个像素点,只需要将GRAM中的对应bit位写1即可.GRAM中是分页来管 ...
- vue-cli 3.0 路由懒加载
当打包构建应用时,Javascript 包会变得非常大,影响页面加载.如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样就更加高效了. 1. 安装 synta ...
- 常见 Bash 内置变量介绍
目录 $0$1, $2 等等$#$* 与 "$*"$@ 与 "$@"$!$_$$$PPID$?$BASH$BASH_VERSION$EUID 与 $UID$GR ...
- Tomcat通过自带的Cluster方式实现Session会话共享环境操作记录
一般来说,在多个tomcat集群业务中,session会话共享是必须的需求,不然前端nginx转发过来的请求不知道之前请求在哪台tomcat节点上,从而就找不到session以至于最终导致请求失败.要 ...