jquery mendapat ketinggian dokumen dan ketinggian tetingkap summary_jquery

jquery mendapat ketinggian tetingkap dan ketinggian tetingkap, $(document).height(), $(window).height()

1. $(document).height(): Ketinggian dokumen keseluruhan halaman web
2. $(window).height(): Ketinggian tetingkap kelihatan penyemak imbas
3. $(window).scrollTop(): Ketinggian dari bahagian atas tetingkap visual penyemak imbas ke bahagian atas halaman web (mengimbangi menegak)
4. $(document.body).height();//Ketinggian badan dokumen dalam tetingkap semasa penyemak imbas
5. $(document.body).outerHeight(true);//Jumlah ketinggian badan dokumen dalam tetingkap semasa penyemak imbas, termasuk jidar padding jidar
6. $(window).width(); //Lebar kawasan yang kelihatan pada tetingkap penyemak imbas semasa
7. $(document).width();//Lebar objek dokumen tetingkap semasa penyemak imbas
8. $(document.body).width();//Ketinggian badan dokumen dalam tetingkap semasa penyemak imbas
9. $(document.body).outerWidth(true);//Jumlah lebar badan dokumen dalam tetingkap semasa penyemak imbas, termasuk jidar padding jidar

Untuk memahaminya dalam satu ayat: apabila bar skrol halaman web ditarik ke hujung paling bawah, $(document).height() == $(window).height() $(window).scrollTop( ).

Apabila ketinggian halaman web kurang daripada tetingkap penyemak imbas, $(document).height() mengembalikan $(window).height().

Adalah tidak disyorkan untuk menggunakan ketinggian seperti $("html").height() dan $("body").height().

Sebab:

$("body").height(): Badan mungkin mempunyai sempadan, dan ketinggian yang diperoleh akan lebih kecil daripada $(document).height();

$("html").height(): Maksud ketinggian yang diperoleh pada penyemak imbas berbeza akan berbeza.

Terdapat masalah dengan nilai $(window).height() Apa yang dikembalikan bukan ketinggian tetingkap penyemak imbas?

Sebab: Halaman web tidak termasuk pernyataan

js mendapat ketinggian halaman dan ketinggian tetingkap

Aplikasi praktikal: Tetapkan ketinggian kawasan kandungan yang sesuai

//设置内容区域合适高度
  var docH = $(document).height(),
    winH = $(window).height(),
    headerH = $(".header").outerHeight();
    footerH = $(".footer").outerHeight();
  if(docH<=winH+4){
    $("div.container").height(winH-headerH-footerH-50);
  }