为什么jquery / css需要top属性的’px’，而不是width或height属性？

我有以下javascript / jquery代码：

var some_div = $('
', {}); some_div. css('position', 'absolute'). css('width' , '100'). css('height', '100'). css('top' , '100px'). css('background-color', '#ddf'); some_div.appendTo('body'); 

它按预期工作，因为它从body的顶部定位some_div 100像素，并将其宽度和高度设置为100像素。

如果我将top属性的行更改为css('top' , '100'). 即如果我省略了px ，则该框忽略指定的属性。 显然，top属性需要px才能生效。

我想知道为什么我不必为盒子的宽度和高度指定px 。

Answer 1

仔细阅读了源代码后，它看起来像是一个jQuery怪癖而不是浏览器或CSS奇怪。 jQuery的css函数在此函数中对您提供的值进行大部分预处理。

该函数以各种方式处理某些CSS奇怪和输入奇数。 一种方法是通过添加“px”将数字转换为字符串。 这从不适用于您的情况，因为您提供字符串。

jQuery还有一组钩子，在将它们设置在DOM节点上之前调用CSS值。 您的宽度和高度值在这里被增加，以考虑IE5.5的盒子模型和由setPositiveNumber()添加的px。

结论：从顶部，底部，左侧，右侧，宽度和高度样式中省略’px’是无效的CSS。 由于jQuery正在修改您的属性以支持过时的浏览器和数值，因此您可以通过省略“px”来消除宽度和高度属性中的无效CSS！

以下将有效：

 css('top' , 100)