所以我在IE11…中有这个
四舍五入(我认为…)
console.log($(document).width()); // 808px;
未舍入
console.log($("html")[0].getBoundingClientRect().width); // 807.30993px;
四舍五入(或最接近的整数)
console.log($("html").width()); //807px;
因此,很明显,$(document)和$("html")是相同的,jQuery正在向下取整html元素,而不是像浏览器那样向上取整。或者IE11为$(文档)提供了一些额外的空间,使像素数量比html更高?
我以为html应该代表整个文档?
我的问题:
它们应该是相同的宽度吗?如Firefox、Chrome等。
下面是一个类似问题的答案:在JavaScript中,document关键字是包含HTMLDocument的对象的句柄。所以它们是不一样的,文档是一个对象,它也包含了用于页面的html。
现在,当您从html和文档中获得宽度时。
console.log($("html").width());
提供html的宽度。
和console.log($(document).width());
为您提供文档可见部分的宽度,即<html>
本身的宽度,但有一点不同,如果您对html
应用了边距,则文档的宽度为sum of width of html and the margin applied to it
。
参见此示例http://jsfiddle.net/bbke9n59/
<div style='background:red;height:30px;'></div>
html{
margin:20px;
}
在这里,在我的浏览器中,我得到
console.log('html='+$("html").width()); // width 630
console.log('document='+$(document).width());// width 670
确切地说,宽度相差40px,这只是应用于html
的裕度
现在这一切都是关于chrome和firefox,
关于IE
IE-9当我在IE-9 上运行相同的页面时
console.log('html='+$("html").width()); // width 570
console.log('document='+$(document).width());// width 570
html和文档的宽度没有差异(应该真的有)
IE-11当我在IE-11 上运行相同的页面时
console.log('html='+$("html").width()); // width 517
console.log('document='+$(document).width());// width 557
精确相差40。正如chrome和firefox所展示的那样。
因此,我无法再重现舍入问题(在任何浏览器中),所以对我来说,我想问题不在于使用jquery进行舍入(如果是这个问题,那么jquery会将document
和html
的宽度都舍入,并且仍然使它们的宽度相同)