在js中获取在css中设置的background-image值
1. html部分
<div class="bg-color-two" id="bg_color_two" onclick="setBg(this)"></div>
<div class="bg-color-three" id="bg_color_three" onclick="setBg(this)"></div>
2. css部分
.bg-color-two {
width: 40px;
height:40px;
background-image:url(811915c596d17e09d4f85bd7e80ccee7.jpg);
background-size:40px 40px;
}
.bg-color-three {
width: 40px;
height:40px;
background- image:url(675aa3366a8cda46febf0053c82e4f27.jpeg);
background-size:40px 40px;
}
3. js部分
function setBg(control) {
//google用getComputedStyle(object, attr)方法获取style属性
var bgImage = getComputedStyle(document.getElementById(control.id), "style").backgroundImage;
console.log(bgImage); //bgImage = "url(file:///C:/Users/Gladys/Desktop/811915c596d17e09d4f85bd7e80ccee7.jpg) }
注意:fire和google chrome都可以用getComputedStyle(object, attr)方法获取style属性,而IE浏览器用getStyle(object, attr)获取style里面的属性
在js中获取在css中设置的background-image值的更多相关文章
- 使用JS准确获取URL网址中参数的几种方法
记录下使用JS准确获取URL网址中参数的方法: 参考链接1. https://blog.csdn.net/Zhihua_W/article/details/54845945?utm_source=bl ...
- vue项目中postcss-pxtorem的使用及webpack中的配置 css中单位px和em,rem的区别
移动手机版要求我们在制作嵌入h5的时候去适配不同的手机.适配有多重模式,有flex.百分比等.字体大小的控制也有px.百分比.rem等单位,webpack中 px转rem. vue项目中postcss ...
- 在swt中获取jar包中的文件 uri is not hierarchical
uri is not hierarchical 学习了:http://blog.csdn.net/zdsdiablo/article/details/1519719 在swt中获取jar包中的文件: ...
- 【记录】mybatis中获取常量类中数据
部分转载,已注明来源: 1.mybatis中获取常量类中数据 <update id="refuseDebt"> UPDATE dt_debt a SET ...
- js函数实现转换css中常用的颜色编码
//转换css中常用颜色编码 var toRGB = function (val){ var reg1 = /^#([0-9A-F]{2})([0-9A-F]{2})([0-9A-F]{2})$/i; ...
- iOS中获取系统相册中的图片
一.获取单张图片 思路: 1.利用UIImagePickerController可以从系统自带的App(照片\相机)中获得图片 2.设置代理,遵守代理协议 注意这个UIImagePickerContr ...
- 【poi】用POI新建一个xlsx文件【或者说将数据存入到xlsx中】/【将数据从xlsx中获取到项目中】
第一部分:写入xlsx中 使用POI创建一个xlsx文件: 项目结构如下: 具体使用的POI中的 XSSFWorkbook xlsx对象 Sheet 工作簿对象 Row 行对象 Cell 单元格 ...
- 子PID namespace中获取父namespace中pid的方法
在那篇< 使用独立PID namespace防止误杀进程>中的最后,我碰到了一个难题,那就是父PID namespace中的进程无法使用进入子PID namespace中通过echo $$ ...
- struts2 在 Action 或 Interceptor 中获取 web.xml 中配置的 <context-param> 参数 (这是我的第一篇博文,哈哈。)
最近为了改一个问题,想加一个控制开关,就在web.xml 中配置了一个 <context-param> 参数,并在 Action 或 Interceptor 中获取参数值. 1.在 web ...
随机推荐
- 关于CAJViewer 无法获取document路径问题
修改注册表 进入注册表编辑器: win+R >>输入 regedit 如下图: 修改关键注册表项(两项相同值应同时修改) 1.HKEY_CURRENT_USER\Software\Mic ...
- C语言猜数字游戏
猜数字游戏,各式各样的实现方式,我这边提供一个实现方式,希望可以帮到新手. 老程序猿就不要看了,黑呵呵 源代码1 include stdio.h include stdlib.h include ti ...
- pyMysql
本篇对于Python操作MySQL主要使用两种方式: 原生模块 pymsql ORM框架 SQLAchemy pymsql pymsql是Python中操作MySQL的模块,其使用方法和MySQLdb ...
- 1015: [JSOI2008]星球大战starwar
1015: [JSOI2008]星球大战starwar Time Limit: 3 Sec Memory Limit: 162 MB Description 很久以前,在一个遥远的星系,一个黑暗的帝国 ...
- Install ArchLinux(draft)
1.# dd bs=4M if=/path/to/archlinux.iso of=/dev/sdx status=progress && sync 2. # timedatectl ...
- Collection集合的功能及总结
Collection集合是集合顶层接口,不能实例化 功能 1.添加功能 boolean add(Object obj):添加一个元素 boolean addAll(Collection c):添加一个 ...
- Jmeter教程 简单的压力测试
Jmeter教程 简单的压力测试:http://www.cnblogs.com/TankXiao/p/4059378.html
- UnicodeEncodeError: 'ascii' codec can't encode characters in position 820-823: ordinal not in range(128)
真是奇怪了,在itermi里 print(data) 就能直接运行,而在sublime里,就非得写成这样 print(data.encode('utf-8'))
- 报错:init: Could not find wglGetExtensionsStringARB!
如下操作即可恢复:
- C#中DataTable中的Compute方法使用收集
原文: C#中DataTable中的Compute方法使用收集 Compute函数的参数就两个:Expression,和Filter. Expresstion是计算表达式,关于Expression的详 ...