jQuery .css()在FF和IE中表现不同

时间:2010-05-30 14:31:01

标签: jquery css

当没有边框时,为什么IE返回medium而FF在以下查询中返回0px

.css("border-left-width")

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

Example here

3 个答案:

答案 0 :(得分:7)

使用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: none。这使border-width解析为零。

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

答案 1 :(得分:1)

这看起来只是返回浏览器默认值。如果未指定任何边框,则每个浏览器都有自己的默认值。所以在这里,如果你要添加边框样式,IE会自动显示该样式的中边框,但FF没有任何东西,因为默认宽度为0。

答案 2 :(得分:0)

每当您设计网页样式时,您应始终将所有元素重置为默认值,以便在所有浏览器中保持一致。

在您的css中包含YUI重置包,以便在所有浏览器中显示所有值。

http://developer.yahoo.com/yui/reset/

然后当你调用一个css元素的值时,所有都将以相同的值开始,除非另一个jquery实例在你请求值之前更改了它。