Tetingkap JavaScript - Model Objek Pelayar
Model Objek Penyemak Imbas (BOM)
Tiada standard formal untuk Model Objek Pelayar (BOM).
Kaedah dan sifat sering dianggap sebagai BOM kerana penyemak imbas moden telah melaksanakan (hampir) kaedah dan sifat yang sama untuk interaktiviti JavaScript.
objek tetingkap
Apabila penyemak imbas membuka dokumen, ia mencipta objek tetingkap, iaitu objek tetingkap mewakili tetingkap yang dibuka dalam pelayar.
Objek tetingkap ialah objek global, dan sifat tetingkap boleh digunakan sebagai pembolehubah global. Sebagai contoh, anda hanya boleh menulis dokumen dan bukannya window.document. Begitu juga, anda boleh menggunakan kaedah objek tetingkap semasa sebagai fungsi, seperti hanya menulis alert() dan bukannya Window.alert().
Jika dokumen mengandungi bingkai, penyemak imbas mencipta objek tetingkap untuk dokumen dan objek tetingkap tambahan untuk setiap bingkai.
Petua: Walaupun tiada standard yang jelas untuk objek tetingkap, semua penyemak imbas menyokongnya.
Dokumen HTML DOM juga merupakan salah satu atribut objek tetingkap:
window.document.getElementById("header");
Sama seperti ini :
document.getElementById("header");
Saiz tetingkap
Ada adalah tiga kaedah untuk menentukan Saiz tetingkap penyemak imbas (port pandang penyemak imbas, tidak termasuk bar alat dan bar skrol).
Untuk Internet Explorer, Chrome, Firefox, Opera dan Safari:
window.innerHeight - Ketinggian dalaman tetingkap penyemak imbas
window.innerWidth - Lebar dalaman bagi tetingkap penyemak imbas
Untuk Internet Explorer 8, 7, 6, 5:
document.documentElement.clientHeight
document.documentElement.clientWidth
atau
document.body.clientHeight
document.body.clientWidth
Penyelesaian JavaScript praktikal (merangkumi semua penyemak imbas):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
</head>
<body>
<p id="demo"></p>
<script>
var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
x=document.getElementById("demo");
x.innerHTML="瀏覽器window寬度: " + w + ", 高度: " + h + "。"
</script>
</body>
</html>Kaedah Tetingkap Lain
Beberapa kaedah lain:
window.open() - Buka tetingkap baharu
window.close() - Tutup tetingkap semasa
window.moveTo() - Alihkan tetingkap semasa
window.resizeTo() - Laraskan saiz tetingkap semasa
