jquery - 为什么这个 jQuery css() 不起作用？

Question

我有一个链接样式表，其中包含以下内容:

.dirContent {width: 190px, padding: 10px;)

我正在运行这个脚本:

var npad = $(".dirContent").css("padding");
alert(npad);

...但它不起作用 - 它返回一个空白警报框。现在，如果我运行这个脚本:

var npad = $(".dirContent").css("width");
alert(npad);

它返回“190px”，警报显示正确的值。

想法？

Answer 1

我看到的两个问题:

• CSS 格式错误(其他答案中已介绍)
• shorthand properties 的处理不一致

本质上，检索简写属性在不同浏览器中的工作方式不一致。在 Chrome 中，如果所有 4 条边均等填充，则查询“padding”属性将返回单部分字符串(“1px”)；如果任意边的填充不同，则查询“padding”属性将返回 4 部分字符串(“1px 2px 3px 4px”) 。

但是 IE9 没有返回任何内容。 Firefox 18 什么也不返回。

var npad = $(".dirContent").css("padding");
alert(npad);
npad = $(".dirContent").css("padding-left");
alert(npad);

在几个浏览器中尝试此示例，您应该会看到差异:http://jsfiddle.net/XDL3N/1/

如果你仔细想想，这种行为是有道理的。虽然速记对于设置属性非常有用，但对于获取属性却没有什么用处。您需要解析多段字符串才能对其执行任何有用的操作。