Di bawah standar yang baru didefinisikan, dokumen.Documentedlement. ClientHeight dapat memperoleh nilai yang benar di IE dan Firefox.
<bahasa skrip = "javascript">
Fungsi getInfo ()
{{
var s = "";
S + = "Halaman web terlihat lebar area:" + document.body.clientwidth ;
S + = "Area Tinggi yang Terlihat Tinggi:" + Document.Body.ClientHeight ;
S + = "Lebar area terlihat webpage:" + document.body.offsetWidth + "(termasuk lebar tepi dan bilah gulir)";
S + = "Area Tinggi yang Terlihat Tinggi:" + Document.Body.OffsetHeight + "(termasuk lebar tepi)";
S + = "Teks Web Lebar teks lengkap:" + document.body.scrollwidth;
S + = "Teks Teks Tinggi Tinggi Tinggi:" + dcument.body.scrollheight;
S + = "ff) yang digulung dari halaman web:" + document.body.scrolltop;
S + = "yaitu):" + document.documentelement.scrolltop;
S + = "halaman web digulung di sebelah kiri:" + document.body.scrollleft;
S + = "Bagian Teks Web:" + Window.Screentop;
S + = "halaman web bagian teks kiri:" + window.screenleft;
S + = "Resolusi Layar Tinggi:" + Window.Screen.height;
S + = "Lebar resolusi layar:" + window.screen.width;
S + = "layar yang tersedia Area kerja:" + window.screen.availheight;
S + = "layar tersedia area kerja:" + window.screen.availwidth;
S += "Pengaturan layar Anda adalah" +window.screen.colordepth +"bit color";
S += "Pengaturan Layar Anda" +Window.Screen.DeviceXDPI +"Pixel/Inch";
Peringatan;
}
getInfo ();
</script>
Dalam tes lokal:
Anda dapat menggunakannya di bawah IE, Firefox, Opera
document.body.clientwidth
document.body.clitingheight
Ini dapat diperoleh, sangat sederhana dan nyaman.
Dan dalam proyek perusahaan:
Opera masih digunakan
document.body.clientwidth
document.body.clitingheight
Tapi yaitu dan firefox digunakan
Document.DocumentElement.clientwidth
Document.DocumentElement.ClientHeight
< !
Jika Anda menambahkan baris ini ke halaman
Di IE:
document.body.clientwidth ==> lebar objek tubuh
Document.Body.ClitingHeight ==> Tinggi Objek Tubuh
document.documentelement.clientwidth ==> lebar area yang terlihat
Document.DocumentElement.clientHeight ==> Tinggi area yang terlihat
Di Firefox:
document.body.clientwidth ==> lebar objek tubuh
Document.Body.ClitingHeight ==> Tinggi Objek Tubuh
document.documentelement.clientwidth ==> lebar area yang terlihat
Document.DocumentElement.clientHeight ==> Tinggi area yang terlihat
Di opera:
document.body.clientwidth ==> lebar area yang terlihat
Document.Body.ClitingHeight ==> Tinggi Area Terlihat
Document.DocumentElement.ClientWidth ==> Lebar objek halaman (yaitu, lebar objek tubuh ditambah lebar margin)
document.documentelement.clientHeight == >> Tinggi objek halaman (yaitu, ketinggian objek tubuh ditambah margin tinggi)
Misalkan OBJ adalah kontrol HTML.
Obj.offsettop mengacu pada posisi, integer, dan unit piksel dari kontrol atas atau atas.
OBJ.Offsetleft mengacu pada posisi, integer, unit piksel dari kontrol kiri atau atas.
OBJ.OffsetWidth mengacu pada lebar, integer, unit piksel dari kontrol OBJ itu sendiri.
OBJ.OffsetHeight mengacu pada ketinggian, bilangan bulat, unit piksel OBJ Control sendiri.
Kami menjelaskan "lapisan atas atau atas" dan "lapisan kiri atau atas" yang disebutkan sebelumnya.
Misalnya:
<Div id = "Tool">
<input type = "tombol" value = "kirim">
<input type = "tombol" value = "reset">
</div>
Offsettop tombol "Kirim" mengacu pada jarak antara lapisan "alat" pada lapisan "alat", karena yang paling dekat dengan bingkai atas lapisan "alat" yang paling dekat dengannya.
Offsettop tombol "Reset" mengacu pada jarak antara lapisan "alat" pada lapisan "alat", karena yang paling dekat dengan bingkai atas lapisan "alat" yang paling dekat dengannya.
Offsetleft dari tombol "Kirim" mengacu pada jarak antara lapisan "alat" dari tombol "Kirim", karena sisi kiri lapisan "alat" yang paling dekat dengan sisi kiri lapisan "alat" adalah yang kiri.
Offsetleft dari tombol "Reset" mengacu pada jarak tombol "Kirim" dari tombol "Kirim", karena bingkai kanan tombol "Kirim" yang paling dekat dengan itu adalah sisi kanan dari tombol "Kirim".
Offsettop bisa mendapatkan posisi elemen HTML dari atas atau elemen luar, dan gaya. Top juga dimungkinkan.
1. Offsettop Mengembalikan angka, sementara Style.Top mengembalikan string.
2. Offsettop hanya dibaca, sementara style.top dapat dibaca dan ditulis.
Ketiga, jika Anda tidak menentukan gaya teratas untuk elemen HTML, style.top mengembalikan string kosong.
Offsetleft dan style.
ScrollHeight: Dapatkan ketinggian gulir objek.
Scrollleft: atur atau dapatkan jarak antara ujung kiri konten yang saat ini terlihat di batas kiri dan jendela objek
Scrolltop: Atur atau dapatkan jarak antara bagian atas objek dan bagian atas jendela di jendela
Scrollwidth: Dapatkan lebar gulir objek
OffsetHeight: Ketinggian koordinat induk yang ditentukan oleh atribut offsetparent oleh objek yang diperoleh
Offsetleft: Untuk perhitungan posisi kiri koordinat patriarki dari koordinat patriarki yang ditentukan oleh atribut offsetparent
Offsettop: Posisi teratas dari perhitungan koordinat patriarkal dari pola yang ditentukan oleh atribut offsettop
Koordinat Horizontal Event.clientx dari Dokumen Relatif
Koordinat vertikal KLIENTY Dokumen Relatif
Koordinat horizontal event.offsetx
Koordinat vertikal Event.Offsety
Document.documeNetelement.scrolltop Valley Valley Rolling Valley
Event.clientx+document.documentelement.scrolltop Label kursi horizontal dari dokumen relatif+jumlah rolling vertikal bergulir
Di atas terutama mengacu pada perbedaan antara firefox di IE: sebagai berikut:
IE6.0, FF1.06+:
ClientWidth = lebar + padding
ClientHeight = Tinggi + Padding
OffsetWidth = Lebar + Padding + Border
OffsetHeight = Tinggi + Padding + Border
IE5.0/5.5:
ClientWidth = Width -Border
ClientHeight = Height -border
OffsetWidth = Lebar
OffsetHeight = Tinggi
(Perlu disebutkan: Atribut margin dalam CSS tidak terkait dengan ClientWidth, OffsetWidth, ClientHeight, OfficeTheight)