ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScriptウィンドウオブジェクトの理解

JavaScriptウィンドウオブジェクトの理解

William Shakespeare
William Shakespeareオリジナル
2025-02-09 11:15:11697ブラウズ

グローバルオブジェクトとブラウザウィンドウ:JavaScriptのウィンドウオブジェクトに深く飛び込みます

すべてのJavaScript環境には、グローバルオブジェクトが搭載されています。 グローバルスコープで宣言された変数は、このオブジェクトのプロパティになり、関数はその方法になります。 ブラウザでは、このグローバルオブジェクトはwindowオブジェクトであり、Webページを表示するブラウザウィンドウを表しています。この記事では、windowオブジェクトの重要な使用法について説明します。

Understanding the JavaScript Window Object

重要な概念:

  • windowオブジェクトは、ブラウザのグローバルオブジェクトです。グローバル変数はそのプロパティです。グローバル関数はその方法です。
  • ブラウザオブジェクトモデル(BOM)は、ブラウザと画面情報(ブラウザータイプ、画面寸法、アクセスページなど)を提供するwindowオブジェクトプロパティとメソッドのコレクションです。
  • オブジェクトは、ダイアログボックスを作成および管理するための方法を提供します(
  • windowalert())。 ユーザーインタラクションまでこれらの停止実行。confirm() prompt()
  • オブジェクトは、ブラウザ情報にアクセスし、履歴をナビゲートし、ウィンドウを制御するためのプロパティと方法を提供します(開閉、サイズ変更、閉鎖)。
  • windowオブジェクトには、ページのコンテンツを操作するための
  • オブジェクトが含まれています。
  • windowdocumentブラウザオブジェクトモデル(BOM)
オブジェクトからアクセス可能なBOMは、ブラウザと画面に関する情報を提供します。 公式には標準化されていませんが、多くのプロパティとメソッドは、主要なブラウザ全体で一貫してサポートされています。 各ブラウザウィンドウ、タブ、ポップアップ、フレーム、およびiframeには独自の

オブジェクトがあります。 BOMのブラウザ固有の性質:

window覚えておいてください、JavaScriptはさまざまな環境で実行されます。 BOMは、ブラウザのコンテキスト内でのみ関連します。 他の環境(node.jsなど)にはオブジェクトがありませんが、それでもグローバルオブジェクト(node.jsでwindowなど)があります。 環境に関係なくグローバルオブジェクトにアクセスするには、グローバルスコープの

キーワードを使用します。

グローバル変数とウィンドウオブジェクト:

windowグローバル変数(globalthis、または

なしで宣言)は、グローバルオブジェクトのプロパティです。ブラウザでは、これは
<code class="language-javascript">const globalObject = this;</code>
オブジェクトのプロパティであることを意味します。

一般的に、グローバル変数に直接アクセスし(なし)、コードの移植性が向上します。 ただし、

経由でそれらにアクセスすることは、変数が定義されているかどうかを確認するのに役立ちます。
<code class="language-javascript">const globalObject = this;</code>

のような関数は、グローバルオブジェクトメソッドです(したがって、ブラウザではparseInt()メソッド)。 それらを直接呼び出すことは(isNaN()なし)標準的な慣行です。window window.

ダイアログボックス(

alert()):confirm()prompt() これらの関数はダイアログボックスを作成し、ユーザーが対話するまで実行を一時停止します。 プログラムの流れを混乱させる可能性があるため、慎重に使用してください:

    :メッセージボックスが表示されます。返品
  • window.alert('Message')undefined Understanding the JavaScript Window Object
  • :確認ダイアログ(OK/キャンセル)を表示します。返品
  • (OK)またはwindow.confirm('Question?')(キャンセル)。 truefalse Understanding the JavaScript Window Object
  • 入力フィールドを備えたプロンプトを表示します。入力テキスト(OK)または
  • (キャンセル)を返します。 window.prompt('Prompt', 'Default'):null Understanding the JavaScript Window Object
ブラウザ情報(ナビゲーターオブジェクト):

オブジェクトはブラウザ情報を提供します。

プロパティは、ブラウザとオペレーティングシステムを説明する文字列を返します。 ただし、この情報は信頼できず、変更できます window.navigatoruserAgenturlの詳細(

):

window.location オブジェクトには、URL情報が含まれています:

window.location

:full url(read/write)
  • href:プロトコル(例えば、
  • protocolhttps::ドメインとポート
  • host:domain
  • hostname:ポート番号
  • port:パス
  • pathname:クエリ文字列
  • search:フラグメント識別子
  • hash:プロトコルとドメイン(読​​み取り専用)
  • origin
  • ナビゲーション用の方法も

locationなどのメソッドを提供します。 reload()assign()ブラウザ履歴(replace()):

window.historyオブジェクトは、以前に訪問されたページへのアクセスを提供します。 訪問したページの数を示します。

、およびwindow.history歴史をナビゲートします。length go(n)forward()ウィンドウコントロール(back()

):window.open()close() moveTo()これらのメソッドはウィンドウを制御します:resizeTo()

  • window.open(url, title, attributes):新しいウィンドウを開きます。 Understanding the JavaScript Window Object
  • window.close():ウィンドウを閉じます。
  • window.moveTo(x, y):ウィンドウを移動します。
  • window.resizeTo(width, height):ウィンドウを変更します。

これらを注意して使用します。多くのブラウザは、過去の虐待(ポップアップ広告)のために使用を制限しています。

スクリーン情報():window.screen

オブジェクトは画面情報を提供します:window.screen

  • height:画面の寸法。width
  • availHeight:使用可能な画面寸法(メニューを除く)。availWidth
  • :色のビット深さ。colorDepth

ドキュメントオブジェクト:

オブジェクトには、ページのコンテンツを操作するためのwindowオブジェクトが含まれています(他の場所で詳細にカバーされています)。 documentメソッドはページにテキストを書き込み、ページが既にロードされている場合は既存のコンテンツを上書きします。 その使用は一般に落胆しています。document.write()

faqs:

  • ブラウザ環境のグローバルオブジェクトはオブジェクトですか?window
  • それにアクセスする方法は?直接、または
  • キーワードを使用しています。 一般的なプロパティ?window
  • document location innerWidthinnerHeight
  • ページが完全にロードされたときにトリガーされたイベント。
  • window.onloadブロックされたポップアップを検出しますか?
  • この包括的な概要では、JavaScriptのオブジェクトとそれに関連する機能を効果的に利用するように装備する必要があります。これらの強力なツールを責任を持って使用し、ユーザーエクスペリエンスを検討することを忘れないでください。

以上がJavaScriptウィンドウオブジェクトの理解の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。