2

だから私はIE11でこれを持っています...

丸められた（私は思う...）

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

丸めない

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

ROUNDED DOWN (または最も近い整数に)

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

したがって、どうやら $(document) と $("html") のどちらも同じであり、jQuery はブラウザーのように html 要素を切り上げるのではなく切り捨てています。または、IE11 は $(document) に余分なスペースを与え、html よりも高いピクセル数を増やしますか?

html はドキュメント全体を表すものだと思っていましたか?

私の質問：

それらは同じ幅であるべきですか？Firefox、Chrome などのように。

4

1 に答える 1

2

同様の質問に対する回答を次に 示します。JavaScript では、document キーワードは、HTMLDocument を含むオブジェクトのハンドルです。 したがって、それらは同じではなく、 document は object であり、ページの 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

ちょうど、幅の 40 ピクセルの違い、それはに適用されるマージンのみです。html

これはクロムとファイアフォックスに関するものでした

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

クロムとファイアフォックスが示したように、40の正確な違い。

そのため、(どのブラウザーでも) 丸めの問題を再現できなくなったので、私にとっては、問題は jquery を使用した切り上げにはないと思います (それが問題である場合、jquery は幅を切り上げたでしょう)と両方の場合、それでも同じ幅にしdocumentますhtml）

于 2015-02-13T07:56:29.877 に答える