图片由模糊变清楚

<button id=btnLoad>load</button>
<button id=btnToggle style="display:none">toggle</button>
<img id=img src=https://d262ilb51hltx0.cloudfront.net/freeze/max/30/1*0oCBXtKSgMEbBlDbvwqC6w.png?q=20 data-src=https://d262ilb51hltx0.cloudfront.net/max/800/1*0oCBXtKSgMEbBlDbvwqC6w.png />

　　

img{
  display: block;
  800px;
  height:443px;
}

　　

var src = img.src;
var rawSrc = img.getAttribute('data-src');

var loadImage = function(url, fn){
	var _img = new Image();
  _img.onload = function(){
  	fn(true);
  };
  _img.onerror = function(){
  	fn(false);
  };
  _img.src = url;
};

btnLoad.onclick = function(){
	btnLoad.textContent = 'loading';
  btnLoad.onclick = null;
  btnLoad.disabled = true;
  loadImage(rawSrc, function(success){
		btnLoad.textContent = success ? 'load success' : 'load failed';
    btnToggle.style.display = '';
    img.src = rawSrc;
  });
}

btnToggle.onclick = function(){
  img.src = img.src === src ? rawSrc : src;
};