HTML5中IOS与Android系统浏览器在引用图片时的差异?

大家好,好久没更新博客了,今天给大家带来的内容是前天在项目中遇到的一个坑,这个坑与IOS,Android浏览器内核有关,下面开始正题!

  1. 场景
    在js文件中需要我们动态为div设置一个背景或者图标
  2. 常用方式
    使用zepto或jq
$('#bg').css('backGroundImage','url(../image/isOk.png)');

咋眼一看上面的代码如果文件都有的话,html页面上会正常显示出我们想要的结构。但是,如果在HTML5做混合APP时,这里有个坑、、、

3.我当时的场景:(image文件夹中只有isOk.png的图片)
由于敲代码时大小写切换没注意,将图片的名字写成了IsOK.png,如下代码:

$('#bg').css('backGroundImage','url(../image/IsOK.png)');

在使用Android手机调试时一切正常,在ios手机上显示不出来,

解决方案:图片名称改成isok.png或Isok.png

猜你喜欢

转载自blog.csdn.net/li11_/article/details/79193210