Rumah >hujung hadapan web >tutorial js >Memahami objek tetingkap JavaScript

Memahami objek tetingkap JavaScript

William Shakespeare
William Shakespeareasal
2025-02-09 11:15:11697semak imbas

objek global dan tetingkap penyemak imbas: menyelam mendalam ke objek tetingkap JavaScript

Setiap persekitaran JavaScript mempunyai objek global. Pembolehubah yang diisytiharkan dalam skop global menjadi sifat objek ini, dan fungsi menjadi kaedahnya. Dalam penyemak imbas, objek global ini adalah objek window, yang mewakili tetingkap penyemak imbas yang memaparkan laman web. Artikel ini meneroka kegunaan utama objek window.

Understanding the JavaScript Window Object

Konsep Utama:

    objek
  • adalah objek global penyemak imbas. Pembolehubah global adalah sifatnya; Fungsi global adalah kaedahnya. window
  • Model Objek Penyemak Imbas (BOM) adalah koleksi
  • sifat objek dan kaedah yang menyediakan maklumat penyemak imbas dan skrin (jenis penyemak imbas, dimensi skrin, halaman yang dikunjungi, dan lain -lain). window
  • Objek
  • menawarkan kaedah untuk membuat dan menguruskan kotak dialog (window, alert(), confirm()). Ini menghentikan pelaksanaan sehingga interaksi pengguna. prompt()
  • Objek
  • menyediakan sifat dan kaedah untuk mengakses maklumat penyemak imbas, menavigasi sejarah, dan mengawal tingkap (pembukaan, saiz semula, penutupan). window
  • setiap objek
  • mengandungi objek window untuk memanipulasi kandungan halaman. document

model objek penyemak imbas (bom)

BOM, boleh diakses melalui objek

, memberikan maklumat mengenai penyemak imbas dan skrin. Walaupun tidak diseragamkan secara rasmi, banyak sifat dan kaedah disokong secara konsisten di seluruh pelayar utama. Setiap tetingkap penyemak imbas, tab, pop timbul, bingkai, dan iframe mempunyai objek sendiri window. window

sifat khusus penyemak imbas BOM:

Ingat, JavaScript berjalan dalam pelbagai persekitaran. BOM hanya relevan dalam konteks penyemak imbas. Persekitaran lain (seperti node.js) kekurangan objek

, tetapi masih memiliki objek global (mis., window dalam node.js). Untuk mengakses objek global tanpa mengira persekitaran, gunakan kata kunci global dalam skop global: this

<code class="language-javascript">const globalObject = this;</code>

pembolehubah global dan objek tetingkap:

Pembolehubah global (diisytiharkan tanpa

, const, atau let) adalah sifat objek global. Dalam penyemak imbas, ini bermakna mereka adalah sifat objek var: window

<code class="language-javascript">x = 6;          // Global variable
window.x === x; // true</code>
Secara amnya, mengakses pembolehubah global secara langsung (tanpa

), meningkatkan kebolehgunaan kod. Walau bagaimanapun, mengaksesnya melalui window. berguna untuk memeriksa jika pemboleh ubah ditakrifkan: window

<code class="language-javascript">const globalObject = this;</code>

fungsi seperti parseInt() dan isNaN() adalah kaedah objek global (dan dengan itu window kaedah dalam pelayar). Secara langsung memanggil mereka (tanpa window.) adalah amalan standard.

kotak dialog (alert(), confirm(), prompt()):

Fungsi ini membuat kotak dialog, berhenti pelaksanaan sehingga pengguna berinteraksi. Gunakan mereka dengan bijak, kerana mereka boleh mengganggu aliran program:

  • window.alert('Message'): Memaparkan kotak mesej. Pulangan undefined. Understanding the JavaScript Window Object
  • window.confirm('Question?'): Memaparkan dialog pengesahan (OK/Batal). Pulangan true (ok) atau false (batal). Understanding the JavaScript Window Object
  • window.prompt('Prompt', 'Default'): Memaparkan prompt dengan medan input. Mengembalikan teks input (OK) atau null (Batal). Understanding the JavaScript Window Object

Maklumat penyemak imbas (Objek Navigator):

Objek window.navigator menyediakan maklumat penyemak imbas. Hartanah userAgent mengembalikan rentetan yang menggambarkan pelayar dan sistem operasi. Walau bagaimanapun, maklumat ini tidak boleh dipercayai dan boleh diubah suai.

Butiran URL (window.location):

Objek window.location mengandungi maklumat URL:

  • href: URL penuh (baca/tulis)
  • protocol: protokol (mis., https:)
  • host: domain dan port
  • hostname: domain
  • port: Nombor port
  • pathname: path
  • search: String query
  • hash: Pengenalpastian serpihan
  • origin: protokol dan domain (baca sahaja)

location juga menawarkan kaedah seperti reload(), assign(), dan replace() untuk menavigasi.

Sejarah penyemak imbas (window.history):

Objek window.history menyediakan akses kepada halaman yang telah dikunjungi sebelumnya. length memberikan bilangan halaman yang dikunjungi. go(n), forward(), dan back() menavigasi melalui sejarah.

Kawalan tetingkap (window.open(), close(), moveTo(), resizeTo()):

kaedah ini mengawal tingkap:

  • window.open(url, title, attributes): Membuka tetingkap baru. Understanding the JavaScript Window Object
  • window.close(): Menutup tetingkap.
  • window.moveTo(x, y): Menggerakkan tetingkap.
  • window.resizeTo(width, height): mengubah saiz tetingkap.

Gunakan ini dengan berhati -hati; Ramai penyemak imbas mengehadkan penggunaannya kerana penyalahgunaan masa lalu (iklan pop timbul).

Maklumat skrin (window.screen):

objek window.screen memberikan maklumat skrin:

  • height, width: dimensi skrin.
  • availHeight, availWidth: dimensi skrin yang boleh digunakan (tidak termasuk menu).
  • colorDepth: kedalaman bit warna.

Objek dokumen:

setiap objek window mengandungi objek document untuk memanipulasi kandungan halaman (ditutup secara terperinci di tempat lain). Kaedah document.write() menulis teks ke halaman, menimpa kandungan yang ada jika halaman sudah dimuatkan. Penggunaannya biasanya tidak digalakkan.

FAQs:

  • Apakah objek window? Objek global dalam persekitaran penyemak imbas.
  • bagaimana untuk mengaksesnya? secara langsung atau menggunakan kata kunci . window
  • sifat biasa?
  • , , document, location. innerWidth innerHeight
  • ? acara yang dicetuskan apabila halaman dimuat sepenuhnya. window.onload
  • Mengesan pop timbul yang disekat?
  • Periksa nilai pulangan . window.open() Gambaran keseluruhan yang komprehensif ini harus melengkapkan anda untuk menggunakan objek JavaScript
  • dan ciri -ciri yang berkaitan. Ingatlah untuk menggunakan alat -alat yang berkuasa ini dengan bertanggungjawab dan pertimbangkan pengalaman pengguna.

Atas ialah kandungan terperinci Memahami objek tetingkap JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn