在Web开发过程中，我们经常需要操作或获取页面元素的属性信息，图片高度便是其中之一。使用jQuery库可以非常方便地实现这一功能。本文介绍了使用jQuery获取图片高度的两种方法，并解释了可能遇到的返回值为0的情况以及如何解决。
jQuery库提供了一种非常简洁的语法，使得开发者可以轻松地对页面中的元素进行选择和操作。对于获取图片高度，最直接的方法就是使用选择器选中页面中的所有图片元素，并调用`.width()`或`.css("width")`方法。`.width()`方法返回图片的宽度值，单位为像素，它返回的是一个不带单位的纯数字。而`.css("width")`返回的也是图片的宽度值，不过它是一个包含"px"单位的字符串。由于这两者获取的都是图片的宽度，因此，对于高度，只需替换`.width()`为`.height()`，`.css("width")`为`.css("height")`，即可用于获取图片的高度。
不过，在使用这些方法时，可能会遇到图片高度或宽度返回值为0的情况，这通常是因为在获取这些属性值的时候，图片还没有被完全加载到页面上。解决这一问题，一种方法是预先在HTML标签中或CSS样式中设置好图片的尺寸，这样就能确保在使用jQuery获取高度时，返回的值不会是0。但这种方法不够动态，如果图片是动态加载或者图片尺寸不固定，则需要另外的策略。
文章中提到的第二种方法是结合特定的JavaScript事件来获取图片高度。文档对象模型（DOM）是HTML和XML文档的编程接口，而当DOM结构创建完成后，资源如图片等可能还未完全加载，这时，如果使用`$(function(){})`（即`$(document).ready()`的简写形式）这个jQuery事件，它会在DOM结构加载完成后立即执行，而不必等待其他资源的加载。这意味着在图片实际加载完成前，我们使用`.height()`或`.css("height")`方法获取到的可能是0，因为图片尺寸此时还未可知。
为了解决这个问题，可以使用`window.onload`事件。`window.onload`是在页面所有的资源（图片、脚本等）加载完毕后才触发的事件，因此，如果将获取图片高度的操作放在`window.onload`函数内，就可以确保在获取高度的时候图片已经加载完成，从而得到正确的尺寸值。
虽然直接使用jQuery方法获取图片高度在大多数情况下都是有效的，但在图片未完全加载的情况下会遇到问题。为避免这种情况，可以通过监听`window.onload`事件来确保图片已加载完毕再执行获取尺寸的操作。而对于动态内容或者响应式设计中，图片尺寸可能会变化，那么就需要更复杂的逻辑来处理，可能涉及到监听图片加载事件`Image.onload`或者使用`window.onresize`事件等。
文章中还提到，在阅读《Learning jQuery》时，作者体会到的两种常见的JavaScript事件加载方法。第一种是`$(function(){})`，它确保了DOM完全加载，但不保证所有外部资源加载完成；第二种是`window.onload=function(){}`，它则是在所有资源加载完毕后才执行，能确保获取到准确的图片尺寸。选择合适的方法取决于你的具体需求，如果需要获取的尺寸信息和DOM结构紧密相关，但又不依赖于资源加载完成，则前者更为适用；如果尺寸信息需要在页面加载所有资源之后才准确，那么后者更为适合。
