如何使用 JavaScript 获取图像大小（高度和宽度）？

要获取图像的大小（高度和宽度），使用Element.clientHeight和Element.clientWidth属性。

• Element.clientHeight：我们可以通过这个属性访问元素的内部高度。此高度包括填充，但不包括边距和边框。
• Element.clientWidth：我们可以使用该属性访问元素的内部宽度。此宽度包括填充，但不包括边距和边框。

  注意：这里 Element 是图片，所以image.clientHeight和image.clientWidth将分别用于获取图片的高度和宽度。

  示例：获取图像大小。

    
  
      
      
        getting-height-width-image-using-javascript
    
      
          h1 {
              text-align: center;
              letter-spacing: 1px;
          }
            
          img,
          button {
              display: block;
              margin: 0 auto;
          }
            
          button {
              font-size: large;
          }
      
  
    
  
    
      
        Getting height and width of an image
    
      
      
      
      
        Get height and width
    
    
      
          
    
          
    
          
    
          
      
  
    
  
      function myFunc() {
          let image = document.getElementById('image');
          let height = document.getElementById('height');
          var width = document.getElementById('width');
    
          height.innerHTML += '<h1>height of image is :'
          + image.clientHeight + 'px </h1>';
          
          width.innerHTML += '<h1>width of image is :'
          + image.clientWidth + 'px </h1>';
      }
  
    

  输出：
  点击按钮后：
  

  点击按钮后：