Tetingkap JavaScript


Model Objek Pelayar (BOM) memberikan JavaScript keupayaan untuk "bercakap" dengan penyemak imbas.

Model Objek Penyemak Imbas (BOM)

Model Objek Penyemak Imbas (Browser ObjekM odel ( BOM)) tiada piawaian formal.

Kaedah dan sifat sering dianggap sebagai BOM kerana penyemak imbas moden telah melaksanakan (hampir) kaedah dan sifat yang sama untuk interaktiviti JavaScript.

Objek Tetingkap

Semua penyemak imbas menyokong objek tetingkap. Ia mewakili tetingkap penyemak imbas.

Semua objek, fungsi dan pembolehubah global JavaScript secara automatik menjadi ahli objek tetingkap.

Pembolehubah global ialah sifat objek tetingkap.

Fungsi global ialah kaedah objek tetingkap.

Malah dokumen HTML DOM ialah salah satu sifat objek tetingkap:

window.document.getElementById("header");

Sama seperti ini:

document.getElementById("header");

Saiz tetingkap

Terdapat tiga cara untuk menentukan saiz tetingkap penyemak imbas (port pandang penyemak imbas, bukan 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 tetingkap penyemak imbas

Untuk Internet Explorer 8, 7, 6, 5:

  • dokumen .documentElement .clientHeight

  • document.documentElement.clientWidth

atau

  • document.body. clientHeight

  • document.body.clientWidth

Penyelesaian JavaScript praktikal (meliputi semua penyemak imbas):

Contoh

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(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>

Jalankan contoh»

Klik butang "Jalankan contoh" untuk melihat contoh dalam talian

Contoh ini menunjukkan ketinggian daripada tetingkap dan lebar penyemak imbas: (tidak termasuk bar alat/bar tatal)

Kaedah Tetingkap Lain

Beberapa kaedah lain:

  • tetingkap.buka ( ) - Buka tetingkap baharu

  • window.close() - Tutup tetingkap semasa

  • window.moveTo() - Gerakkan arus tetingkap

  • window.resizeTo() - Ubah saiz tetingkap semasa