响应式图片一 js实现

响应式设计是为了兼容手机，pc,ipad等设备，但是要在手机上去加载为pc设计的几百k的图片，这是比较耗流量的，并且还需要更长的加载时间。这个时候我们考虑加载与设备大小相匹配的图片。
响应式图片不仅仅是指图片的大小，更多的是指根据设备大小加载不同的图片。今天我们先说一下第一种方法，通过java script或服务端实现。其原理就是window的resize事件，resize事件会在元素的尺寸大小被调整时触发。具体的代码如下。

类似的这种方法还有：通过把屏幕或是设备信息写入cookies，在获取图片的时候在服务器端决定返回哪种图片，这样的话就不需要写脚本了。

但是，通过js的方法，需要我们编码实现响应式的逻辑，修改的时候不是很方便，是一种命令式的实现，下一次来说一下声明式的方法，声明的方法就是把这些图片声明在html中，由浏览器根据屏幕的大小，来觉得加载哪种图片。