jQuery .css() 在 FF 和 IE 中的行为不同

Question

当没有边框时，为什么 IE 返回 medium 而 FF 在下面的查询中返回 0px？

.css("border-left-width")

我在 FF 3.6.3 和 IE 6/7 中检查过这个。

Example here

Answer 1

使用 css() 读取样式表应用的样式在不同的浏览器上有不同的作用。

在 IE 上，它从 IE 特定的 currentStyle 中读取值对象，这是访问此信息的唯一方法。 currentStyle 为您提供 CSS 所称的 ‘specified style’ ，也就是说您在样式表中所写的内容。如果你没有覆盖它，initial value of border-width是“中等”，所以这就是您得到的直接结果。

在其他浏览器上，css() 使用标准的 DOM Level 2 CSS 方法 getComputedStyle() .与 IE 的 currentStyle 不同，它返回“计算样式”，这与指定样式的不同之处在于，像“medium”这样的相对单位被解析为实际长度。

此处“medium”通常解析为大约 3px 的长度，但您可能实际上没有为该元素打开边框，因此它默认为 border-style:无。这使得 border-width 解析为零。

通常“指定样式”和“计算样式”彼此足够接近，您可以用相同的方式处理它们，这就是 jQuery 的 css() 方法依靠。但实际上它们并不完全相同。