Mengapa Menentukan Ketinggian Dokumen dalam JavaScript Sangat Sukar, dan Apakah Penyelesaian yang Boleh Dipercayai?

Mengatasi Cabaran dalam Pengiraan Ketinggian Dokumen dengan JavaScript

Menentukan ketinggian dokumen dengan JavaScript menimbulkan kesukaran pada tapak web tertentu. Pada platform seperti Fandango dan Paperback Swap, pelbagai kaedah JavaScript gagal menghasilkan hasil yang tepat.

Masalahnya

• $(document).height() kembali nilai yang betul untuk Fandango tetapi melemparkan ralat pada Paperback Swap.
• document.height dan document.body.scrollHeight mengembalikan nilai yang salah atau batal.
• Memohon padding-bottom pada elemen tidak mempunyai kesan pada halaman bermasalah ini.

Penyelesaian: Pendekatan Komprehensif

Untuk menentukan ketinggian dokumen dengan tepat, pendekatan yang komprehensif diperlukan:

var body = document.body,
    html = document.documentElement;

var height = Math.max( body.scrollHeight, body.offsetHeight, 
                       html.clientHeight, html.scrollHeight, html.offsetHeight );

Kod ini mengira nilai ketinggian maksimum daripada semua yang tersedia pilihan:

• body.scrollHeight
• body.offsetHeight
• html.clientHeight
• html.scrollHeight
• html.offsetHeight

Pertimbangan

• Nota bahawa pengiraan ketinggian dokumen sebelum dokumen dimuatkan akan sentiasa menghasilkan nilai 0.
• Jika anda menambah kandungan secara dinamik atau membenarkan pengguna mengubah saiz tetingkap, anda mungkin perlu mengira semula ketinggian dokumen.
• Menggunakan acara onload atau siap dokumen akan memastikan pengiraan ketinggian yang tepat pada masa muat.

Atas ialah kandungan terperinci Mengapa Menentukan Ketinggian Dokumen dalam JavaScript Sangat Sukar, dan Apakah Penyelesaian yang Boleh Dipercayai?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!