HTML=>IMG标签图片加载事件

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <style type="text/css">
    img{
      width: 300px;
    }
  </style>
</head>
<body>
  <p id="p1">载入中...</p>
  <img id="img1" src="http://imgurl.imoecg.com/uploaded/20190320053122.jpg">
  <p id="p2">载入中...</p>
  <img id="img2" src="http://imgurl.imoecg.com/uploaded/20190320053121.jpg">
  <script type="text/javascript">
      img1.onload = function() {
        p1.innerHTML = '加载完成'
      }
      img1.onerror = function() {
        p1.innerHTML = '加载失败/错误'
      }
      img1.onabort = function() {
        p1.innerHTML = '加载被中断'
      }
      img2.onload = function() {
        p2.innerHTML = '加载完成'
      }
      img2.onerror = function() {
        p2.innerHTML = '加载失败/错误'
      }
      img2.onabort = function() {
        p2.innerHTML = '加载被中断'
      }
  </script>
</body>
</html>

声明: 本文采用 BY-NC-SA 协议进行授权，如无注明均为原创，转载请注明转自一颗大萝北
本文地址: HTML=>IMG标签图片加载事件