CSS - 从不同的浏览器返回不同的值

Question

当我使用jQuery获取对象的CSS值时,每个浏览器(IE,Mozilla,Chrome等)都会返回不同的值.

例如,在Chrome中,背景图片(.css("background-image"))会返回:

url(http://i41.tinypic.com/f01zsy.jpg)

在Mozilla中,它返回:

url("http://i41.tinypic.com/f01zsy.jpg")

我在其他方面遇到同样的问题,例如background-size.

在chrome中它返回:

50% 50%

但Mozilla回归:

50%+50%

我的问题是,我有分割CSS(背景大小)的函数,例如基于空格.split(""),但这对Mozilla不起作用,因为它使用了+代替.

有什么办法可以解决这个问题并使浏览器使用一个标准吗？

根据用户使用的浏览器类型,是否有任何我可以编写的功能可以抓取和分割值？

Answer 1

不同的浏览器使用不同的 CSS 标准，您可能必须编写一个成熟的解析器才能使它们成为一个标准。

解决方法是您应该考虑不同的浏览器标准来拆分或使用 CSS 值。就像CSS（背景大小）问题可以使用以下方法解决：

space.split("\\s|\\+"); //split my string where it either has a space 'or' a plus sign

对于 CSS(background-image)，解决方案可能是在使用它之前替换掉引号：

space.replace("\"", "");

尝试使拆分适用于所有浏览器。希望有帮助。