Anda perlu mendapatkan koordinat dari beberapa objek HTML untuk mengatur koordinat lapisan target lebih fleksibel. Di sini Anda dapat menggunakan atribut seperti document.body.scrolltop, tetapi atribut ini diperoleh di halaman web standar XHTML atau, secara sederhana, nilai yang diperoleh dalam tag dengan <! Doctype ...> adalah 0; Jika Anda tidak memiliki tag ini, semuanya normal, jadi bagaimana cara mendapatkan koordinat tubuh di xhtml? Tentu saja ada cara. Kami menggunakan Document.DocumentElement untuk menggantikan Document.body. Misalnya, Anda dapat menulisnya seperti ini:
Salinan kode adalah sebagai berikut:
var top = document.documentelement.scrolltop || document.body.scrooltop;
|| Di JS adalah hal yang baik. Ini tidak hanya dapat digunakan dalam pernyataan bersyarat jika, tetapi juga dalam penugasan variabel. Contoh di atas dapat ditulis dalam format berikut:
Salinan kode adalah sebagai berikut:
var top = document.documentelement.scrolltop? document.documentelement.scrolltop: document.body.scrolltop;
Dengan cara ini, dapat memiliki kompatibilitas yang baik. Satu hal yang perlu diperhatikan adalah bahwa jika nilai dokumen.
Instruksi untuk mendapatkan posisi koordinat vertikal dari koordinat bilah gulir pada halaman saat ini:
document.documentelement.scrolltop bukannya
document.body.scrolltop;
Document.DocumentElement mendapatkan tag HTML.
Document.body mendapatkan tag tubuh;
Di bawah standar W3C, Document.Body.ScrollTop selalu 0, dan document.documentelement.scrolltop perlu diganti dengan document.documentelement.scrolltop;
Jika kami ingin menemukan posisi absolut mouse relatif terhadap halaman, sebagian besar hasil yang kami dapatkan di mesin pencari akan memungkinkan Anda menggunakan
event.clientx+document.body.scrollleft, event.clienty+document.body.scrolltop;
Aneh jika Anda menemukan bahwa mouse menyimpang dari imajinasi Anda, karena objek Document.Body.scrollx tidak lagi didukung setelah IE5.5.
Jadi kita perlu menambahkan satu kalimat;
Salinan kode adalah sebagai berikut:
if (document.body && document.body.scrolltop && document.body.scrollleft)
{
top = document.body.scrolltop;
left = document.body.scrollleft;
}
if (document.documentelement && document.documentelement.scrolltop && document.documentelement.scrollleft)
{
top = document.documentelement.scrolltop;
left = document.documentelement.scrollleft;
}
Berikut ini adalah beberapa penggunaan parameter:
Lebar area yang terlihat dari halaman web: document.body.clientwidth;
Tinggi area yang terlihat dari halaman web: document.body.clientHeight;
Lebar area yang terlihat dari halaman web: document.body.offsetwidth; (termasuk lebar garis tepi);
Ketinggian area yang terlihat dari halaman web: document.body.offsetheight; (termasuk lebar tepi);
Lebar teks lengkap dari halaman web: document.body.scrollwidth;
Teks lengkap dari halaman web: document.body.scrollheight;
Halaman web diluncurkan pada tingkat tinggi: document.body.scrolltop;
Kiri halaman web diluncurkan: document.body.scrollleft;
Di bagian utama halaman web: windows.screentop;
Kiri bagian teks halaman web: windows.screenleft;
Resolusi Layar Tinggi: Windows.Screen.Height;
Lebar resolusi layar: windows.screen.widht;
Tinggi ruang kerja yang tersedia dari layar: windows.screen.availheight;
Layar tersedia lebar ruang kerja: windows.screen.availwidth;
Dapatkan ketinggian gulir objek: ScrollHeight;
Atur atau dapatkan jarak antara batas kiri objek dan ujung paling kiri dari konten yang saat ini terlihat di jendela: Scrollleft;
Atur atau dapatkan jarak antara bagian atas objek dan bagian atas konten yang terlihat di jendela: scrolltop;
Dapatkan lebar gulir objek: Scrollwidth;
Mendapat ketinggian objek relatif terhadap tata letak atau koordinat induk yang ditentukan oleh koordinat induk: properti offsetparent: offsetheight;
Dapatkan posisi kiri dari perhitungan objek relatif terhadap tata letak atau koordinat induk yang ditentukan oleh properti offsetparent: offsetleft;
Dapatkan posisi teratas yang dihitung dari objek relatif terhadap tata letak atau koordinat induk yang ditentukan oleh properti offsettop: offsettop;
event.clientx: koordinat horizontal relatif terhadap dokumen;
event.clienty: koordinat vertikal relatif terhadap dokumen;
Event.Offsetx: Koordinat horizontal relatif terhadap wadah;
Event.Offsety: Koordinat vertikal relatif terhadap wadah;
Document.DocumentElement.scrolltop: Atur ketinggian vertikal gulungan
event.clientx + document.documentelement.scrolltop: posisi horizontal relatif terhadap dokumen + jumlah pengguliran dalam arah vertikal;