JavaScript window.opener

window.openerオブジェクトは、自分自身を開いた親ウィンドウを示す。window.opener.documentオブジェクトを参照することで、親ウィンドウのドキュメントを操作できる

存在チェック

現在のウィンドウに親ウィンドウが存在するかチェックする。

if (window.opener != null) {
  // do something
}

window.parentとの違い

Internet Explorer以外のブラウザでは、window.openerとwindow.parentに違いはない。

Internet Explorerでiframeを使うと、window.openerとwindow.parentの動作に一部違いが出る。

プロパティ

opener オブジェクトのプロパティは、window オブジェクトと同じである。opener オブジェクトのプロパティ一覧を以下に示す。

opener オブジェクトのプロパティ
プロパティ 説明
console ウェブ・ブラウザのデバッグ・コンソール
frames すべてのフレームの配列
history ブラウザのURL履歴
jQuery jQuery ライブラリ
localStorage ローカル・ストレージ
location URL
navigator ウェブ・ブラウザ
opener 親ウィンドウ
pageXOffset ウィンドウの左端から水平方向にスクロールされたピクセル数
pageYOffset ウィンドウの状態から垂直方向にスクロールされたピクセル数
parent 親ウィンドウ
screen スクリーン
screenLeft スクリーン対するウィンドウの X 座標
screenX プロパティと同じ
screenTop スクリーン対するウィンドウの Y 座標
screenY プロパティ
self 現在のウィンドウ
top ウィンドウの上端

document

document プロパティは、HTML ドキュメントを示す。

子ウィンドウ(サブウィンドウ)から親ウィンドウ操作を操作する例を示す。

親ウィンドウでは、子ウィンドウを開くボタンとテキストボックスを配置する。

<input type="button" value="子ウィンドウを開く"
   onclick="window.open('child1.html', 'child1', 'width=320,height=240');return false;">
<form name="form01">
  <input type="text" name="text01" value="">
</form>

子ウィンドウでは、親ウィンドウのオブジェクトを操作する関数を定義する。

function setString(val) {
  if (!window.opener || window.opener.closed) {
    // 親ウィンドウが存在しない
    window.close();
  } else {
    // 親ウィンドウのオブジェクトを操作
    window.opener.document.form01.text01.value = val;
  }
}

次に、親ウィンドウを操作するボタンを配置する。

<form name="form1">
  <p>テキストを入力してください: <input type="text" name="text1" value="テキスト"><p>
</form>
<p>
<input type="button" value="親ウィンドウを操作"
     onclick="setString(document.form1.text1.value);return false;">
</p>

メソッド

opener オブジェクトのメソッドは、window オブジェクトと同じである。opener オブジェクトのメソッド一覧を以下に示す。

opener オブジェクトのメソッド
メソッド 説明
alert 警告ダイアログを表示する
clearInterval 一定時間毎に実行する処理を解除する
confirm 確認を行うために「はい」と「いいえ」を選択するダイアログを表示する
open Webブラウザを別ウィンドウ又はタブで開く
prompt 文字列を入力できるダイアログを表示する
setInterval 一定時間毎に実行する処理を設定する

参考文献

Web Hypertext Application Technology Working Group (2023) APIs related to navigation and session history HTML Living Standard