JavaScriptで現在のウィンドウに親ウィンドウがあるかどうかを確認する方法

JavaScript は Web 開発用のプログラミング言語として、Web ページの対話、動的効果、フォーム検証などで広く使用されています。 Web ページの開発およびデザインでは、現在のウィンドウに親ウィンドウがあるかどうかを判断する必要が生じることがあります。この要件は実際の開発では一般的に使用されませんが、一部の特定のシナリオでは非常に役立ちます。この記事では、JavaScript を使用して現在のウィンドウに親ウィンドウがあるかどうかを確認する方法を紹介し、いくつかの一般的なアプリケーション シナリオの詳細な分析を提供します。

1. 親ウィンドウが存在するかどうかを判断するメソッド

Javascript には、現在のウィンドウに親ウィンドウがあるかどうかを判断するための多くの組み込み関数が用意されています。最も一般的な方法は、 を使用することです。 window.parent 属性。 window.parent プロパティにアクセスすると、現在のウィンドウの親ウィンドウ オブジェクトを取得できます。現在のウィンドウに親ウィンドウがあるかどうかを判断するには、window.parent が window と等しいかどうかを判断するだけです。等しい場合、現在のウィンドウには親ウィンドウがないことを意味します。親ウィンドウ。

以下はサンプル コードです:

if (window.parent === window) {
  console.log('当前窗口不存在父窗口');
} else {
  console.log('当前窗口存在父窗口');
}

上記のコードは、window.parent と window の参照を比較することによって、現在のウィンドウが存在するかどうかを判断します。 オブジェクトは等しいです。親ウィンドウ。それらが等しい場合は、現在のウィンドウに親ウィンドウがないことを意味し、そうでない場合は、現在のウィンドウに親ウィンドウがあることを意味します。

window.parent プロパティの使用に加えて、window.top## などの他のメソッドを使用して、現在のウィンドウに親ウィンドウがあるかどうかを確認することもできます。 # プロパティ、window.selfプロパティなど。以下に別の判定方法を示します。

if (window.top === window.self) {
  console.log('当前窗口不存在父窗口');
} else {
  console.log('当前窗口存在父窗口');
}

上記のコードは、

window.top と window.self## の参照を比較することによって、現在のウィンドウに親ウィンドウがあるかどうかを判断します。 # 個のオブジェクト。それらが等しい場合は、現在のウィンドウに親ウィンドウがないことを意味し、そうでない場合は、現在のウィンドウに親ウィンドウがあることを意味します。 2. アプリケーション シナリオと分析例

実際の開発では、現在のウィンドウに親ウィンドウがあるかどうかを判断するシナリオは比較的少数ですが、一部の特定のシナリオでは、この要件は依然として非常に重要です。役に立つ。 。以下では、いくつかの一般的なアプリケーション シナリオを分析します。

ページの埋め込みを防止する

1. 一部の Web サイト (銀行、支払いプラットフォームなど) では、iframe を挿入するときにジャンプが必要です。外部 Web ページに移動する 外部ページに移動して、悪意のある Web サイトがログイン ページに偽装してフィッシング詐欺を行うのを防ぎます。この要件は、現在のウィンドウに親ウィンドウがあるかどうかを判断することで簡単に実現できます。他のWebサイトのiframe内にページが埋め込まれている場合、

window.parent === window

と判断することで外部ページにジャンプできます。 以下はサンプル コードです:

if (window.parent !== window) {
  window.top.location.href = 'http://www.example.com';
}

上記のコードは、

window.parent

と window を判断することによって、現在のウィンドウが別のウィンドウに埋め込まれているかどうかを判断します。 は等しい。Web サイトの iframe で、これらが等しい場合は、現在のウィンドウに親ウィンドウがないことを意味し、そうでない場合は外部ページにジャンプします。

メイン ページの変数を取得する

2. Web サイトによっては、メイン ページの変数をサブページで取得する必要がある場合があります。現在のウィンドウが親ウィンドウに存在するかどうかを確認できます。現在のページに親ウィンドウがある場合は、

window.parent

を介して親ウィンドウの変数にアクセスしたり、親ウィンドウの関数を呼び出したりできます。 以下はサンプルコードです:

親ページのコード:

var username = 'admin';

function logout() {
  console.log('logout');
}

子ページのコード:

if (window.parent !== window) {
  var parentUsername = window.parent.username;
  console.log('parent username:', parentUsername);

  window.parent.logout();
}

上記のコードは判定に合格します

window.parent

と window が等しいかどうかで、現在のウィンドウに親ウィンドウがあるかどうかを判断します。親ウィンドウが存在する場合は、親ウィンドウの変数を取得するか、親ウィンドウで関数を呼び出すことができます。 window.parent 。

iframe を非表示にする

3. Web サイトによっては、iframe を含む一部の要素を非表示にする必要がある場合があります。これは、現在のウィンドウに親ウィンドウがあるかどうかを判断することで実現できます。現在のページに親ウィンドウがある場合は、

display

属性を使用して iframe を含む要素を非表示にすることができます。 以下はサンプル コードです:

if (window.parent !== window) {
  document.getElementById('iframe-wrapper').style.display = 'none';
}

上記のコードは、

window.parent

と window# を判断することによって、現在のウィンドウに親ウィンドウがあるかどうかを判断します。 ## は等しい。存在する場合、iframe を含む要素は display 属性を介して非表示にすることができます。 概要:

Web 開発のプロセスでは、現在のウィンドウに親ウィンドウがあるかどうかを判断する必要はあまりありませんが、特定のシナリオでは、この要件が依然として非常に実用的です。

window.parent

、

window.top、window.self および Javascript によって提供されるその他のプロパティを使用すると、現在のウィンドウに親があるかどうかを簡単に判断できます。したがって、特定のニーズを満たします。ページの埋め込みの防止、メイン ページの変数の取得、iframe の非表示などの一般的なアプリケーション シナリオについては、詳細なサンプル コードと分析も提供します。実際の開発では、Web ページの開発作業をより適切に完了するために、特定のニーズに応じて現在のウィンドウに親ウィンドウがあるかどうかを判断する適切な方法を選択できます。

以上がJavaScriptで現在のウィンドウに親ウィンドウがあるかどうかを確認する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。