在Web开发中，我们常常需要获取图片的宽度和高度。而jQuery是前端开发中一套十分常用的库，在使用jQuery时，通过它提供的API可以轻松地获取图片的宽度和高度。本文将向您介绍常用的jQuery获取图片宽高的方法，帮助您更好地处理图片数据。
一、使用width()和height()方法获取图片宽高
jQuery提供了width()和height()方法，这两个方法返回的是元素的宽和高，包括padding和border的宽度。在jQuery中也可以使用这两个方法获取图片的宽高，代码如下：
```javascript $(document).ready(function(){ var img = $('#myImg'); var imgWidth = img.width(); var imgHeight = img.height(); alert('图片宽度：' + imgWidth + '，图片高度：' + imgHeight); }); ```
上面的代码中，我们使用了jQuery的选择器选择了一个id为"myImg"的图片元素，并通过width()和height()方法获取了它的宽高。在alert()中输出了获取到的信息。这种方式简单，代码量较小，适用于大多数情况。但是需要注意的是，如果图片没有加载完毕，获取到的宽高可能会有误差。
二、使用naturalWidth和naturalHeight属性获取图片宽高
上面介绍的width()和height()方法是获取元素的宽高，包括padding和border的宽度。如果想要获取图片的本来大小，可以使用naturalWidth和naturalHeight属性。这两个属性是HTML5新增的，用来获取图片的真实大小。
下面的代码展示了如何使用naturalWidth和naturalHeight属性获取图片宽高：
```javascript $(document).ready(function(){ var img = $('#myImg')[0]; var imgWidth = img.naturalWidth; var imgHeight = img.naturalHeight; alert('图片宽度：' + imgWidth + '，图片高度：' + imgHeight); }); ```
上面的代码中，我们首先使用jQuery选择器选择了一个id为"myImg"的图片元素，并将其转换成原生的DOM元素对象。在获取到原生DOM元素后，我们就可以使用它的naturalWidth和naturalHeight属性获取图片的宽高。
需要注意的是，naturalWidth和naturalHeight属性需要等到图片完全加载后才能获取到正确的值。如果在图片加载完成前获取值，可能会返回0或undefined。
三、总结
本文介绍了jQuery中获取图片宽度和高度的方法。其中，width()和height()方法可以获取元素的宽高，naturalWidth和naturalHeight属性可以获取图片的真实大小。我们需要根据实际需求选择适合的方法，同时也需要注意图片是否加载完成。在实际开发中，可以根据具体情况灵活运用这些方法，提高开发效率。
