2

所以我在IE11中有这个......

四舍五入（我认为...）

console.log($(document).width()); // 808px;

不圆角

console.log($("html")[0].getBoundingClientRect().width); // 807.30993px;

向下舍入（或最接近的整数）

console.log($("html").width()); //807px;

显然，$(document) 和 $("html") 都是相同的，并且 jQuery 将 html 元素向下舍入，而不是像浏览器那样向上舍入。或者 IE11 为 $(document) 提供了一些额外的空间，增加了比 html 更高的像素数量？

我认为 html 应该代表整个文档？

我的问题：

它们应该是相同的宽度吗？就像在 Firefox、Chrome 等中一样。

4

1 回答 1

2

这是对类似问题的回答： 在 JavaScript 中，document 关键字是包含 HTMLDocument 的对象的句柄。 所以它们不一样，document是一个对象，其中还包含页面的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和document的宽度没有区别（应该真的有）

当我在 IE- 11 上运行相同页面时的 IE-11

   console.log('html='+$("html").width()); // width 517
    
    console.log('document='+$(document).width());// width 557

正如 chrome 和 firefox 显示的那样，相差 40。

所以我不再能够重现舍入问题（在任何浏览器中），所以对我来说，我想问题不在于使用 jquery 进行舍入（如果这是问题，那么 jquery 会舍入宽度对于document和html两者，仍然使它们具有相同的宽度）

于 2015-02-13T07:56:29.877 回答