HTML怎么引用电脑桌面的图片,网页上的img引用的图片如何适配retina屏幕呢？

1. Retina.js，会造成两次图像的请求。

2. JS替换SRC的方法，会造成两次图像的请求。

2.1 自定义一种属性

2.2 使用某种方式匹配相应的标签

jQuery("img[data-src]")//效率在有些浏览器中很低

jQuery("img.rep-src") //需要在HTML中写入更多属性，这里是定义CSS类"rep-src"，维护相对麻烦

2.3 针对相应的屏幕做SRC的替换。

if ( window.devicePixelRatio && window.devicePixelRatio > 1 ) {

jQuery(this).attr( "src" , jQuery(this).data("src") ) ;

//如果自定义的属性是JSON式的，则会这样写：

//jQuery(this).attr( "src" , jQuery(this).data("src")["retina"] ) ;

} //当然实际应用肯定不能写得这么草率，各种情形下的判断要加上。

3.等待新标准……

扩展阅读：