获取一个图片的地址(该图片的路径是写在css的background-img属性中的),一般实现方式:

var topimg = $(".topbg").css("backgroundImage");
alert(topimg);

获取的是包含url(“xxx.jpg”)形式的值,获取url内的值,实现方式如下:

var topimg = $(".topbg").css("backgroundImage");
topimg = topimg.split('(')[1].split(')')[0];
alert(topimg);

在这里一般的安卓手机和ios手机都是无法实现的,alert的内容是包含双引号的图片地址,不是纯图片地址,于是还需要去掉双引号:

var topimg = $(".topbg").css("backgroundImage");
topimg = topimg.split('("')[1].split('")')[0];
alert(topimg)

在这里就可以获取到background-image的图片地址了。

但是,这里有一个坑。。

在iphoneX上依然无法获取到background-image的图片地址,经过不断的断点调试,发现,

在iphoneX上的background-image的值是不包含双引号的:url(image.png);而在其他手机上background-image的值是包含双引号的:url("image.png"),

于是将代码做出如下调整即可实现:

var topimg = $(".topbg").css("backgroundImage");
topimg = topimg.split('(')[1].split(')')[0];
if(topimg.indexOf('"') > -1){
topimg = topimg.split('"')[1].split('"')[0];
}

转载时请注明出处及相应链接,本文永久地址:https://www.cnblogs.com/wangxiaoling/p/9958936.html,文章标题备注转载,如:xxx【转载】,谢谢!

js取得background属性url的值--移动端【踩坑】的更多相关文章

  1. js原生_获取url键值对

    思路: 1.先对url进行处理,获取 ?后的字符串 postid=10457794&actiontip=保存修改成功') 2. 字符串通过&标识,不同参数转为数组 ["pos ...

  2. 获取SpringCloud gateway响应的response的值,记录踩坑

    最近在做网关改造,想要通过Gateway过滤器获取ResponseBody的值,查看了网上的帖子和官网内容: 帖子:https://cloud.tencent.com/developer/articl ...

  3. background属性总结,background-image路径问题相对于css和js

    (1)background属性总结 background 简写属性在一个声明中设置所有的背景属性. 可以设置如下属性:background-color规定要使用的背景颜色.background-pos ...

  4. js中对style中的多个属性进行设值

    js中对style中的多个属性进行设值: 看一下案例自然就明白: document.getElementById("my_wz1").style.cssText="bac ...

  5. js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符

    js中对arry数组的各种操作小结   最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...

  6. [置顶] js中如何复制一个对象,如何获取所有属性和属性对应的值

    在js中如何复制一个对象,例如如下一个js对象. 如果知道这个对象的所有属性自然就可以重新new一个,然后对每个属性赋值,就可以做到,但如果不知道呢?如何创建一个内容相同 的对象呢? var obj= ...

  7. JS基础_属性名和属性值

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. js遍历对象所有的属性名称和值

    /* * 用来遍历指定对象所有的属性名称和值 * obj 需要遍历的对象 * author: Jet Mah * website: http://www.javatang.com/archives/2 ...

  9. js操作对象属性值为字符串

    今天在项目开发中遇到一个没遇到过的问题,这个问题是需要对比两个对象a和b,a是一个只有一个属性的对象,b是一个含有多个属性对象,如果b中包含和a一模一样的属性名和值,则把这个一样的属性和值从b中删除了 ...

随机推荐

  1. Tools - Windows OS

    001 - 文本操作 Ctrl + C / Ctrl + V / Ctrl + X / Ctrl + Z / Ctrl + A:复制/粘贴/剪贴/撤销/全选. 002 - 窗口分屏 使用快捷键 选中程 ...

  2. vue 自学笔记(4): 样式绑定与条件渲染

    一:对象绑定 Vue 对于页面的样式加载也有独特的方式,按照 Vue 提供的方式,我们可以轻松的控制它们的呈现. 假使我们要实现点击 div 变色 Vue 提供的样式方案的本质是对元素节点进行属性的绑 ...

  3. 凉凉了,Eureka 宣布闭源,Spring Cloud 何去何从?

    今年 Dubbo 活了,并且被 Apache 收了.同时很不幸,Spring Cloud 下的 Netflix Eureka 组件项目居然宣布闭源了.. 已经从 Dubbo 迁移至 Spring Cl ...

  4. LeetCode--No.002 Add Two Numbers

    Add Two Numbers Total Accepted: 160702 Total Submissions: 664770 Difficulty: Medium You are given tw ...

  5. Liferay的一些应用领域

    Liferay的用途是快速的部署内外站点,统一权限管理,开发Web热插拔插件,并不是所有系统都适合 不适合Liferay的一些应用领域: 1.独立认证.简单的系统,比如一些简单的增删改查:2.复杂业务 ...

  6. es 基于match_phrase的模糊匹配原理及使用

    [版权声明]:本文章由danvid发布于http://danvid.cnblogs.com/,如需转载或部分使用请注明出处 在业务中经常会遇到类似数据库的"like"的模糊匹配需求 ...

  7. shell编程中如何执行oracle语句

    shell编程中如果向oracle中插入数据之类的,需要先把执行语句放到文件中,然后再@这个文件执行 有如下俩种方式供参考: SQL=`sqlplus user/pwd@orains << ...

  8. RPC的原理总结

    一.RPC的引入 早期单机时代,一台电脑上运行多个进程,大家各干各的,老死不相往来.假如A进程需要一个画图的功能,B进程也需要一个画图的功能,程序员就必须为两个进程都写一个画图的功能.这不是整人么?于 ...

  9. Gradle中使用SpringBoot插件构建多模块遇到的问题

    通常下,多模块的项目如下: Root project 'demospring' +--- Project ':model' \--- Project ':rest' 那么我们需要在rest模块依赖mo ...

  10. linux arm 交叉编译ACE(ubuntu16.04)

    解压ace包 tar zxvf ACE_6.1.0.tar.gz 在终端设置环境变量 sudo gedit /etc/profile 在打开的内容添加 export ACE_ROOT=/home/xx ...