タグ: Windowsオブジェクト

Windowオブジェクト
patentプロパティ
topプロパティ

参考書籍：

オライリー JavaScript 第6版

Windowオブジェクト w をクローズするには、

w.close();

このウィンドウ内で実行されているJavaScriptコードの場合は、次のようにも記述できる

window.close();

明示的にwindowを指定する。
こうすることで、Documentオブジェクトのclose()メソッドでなく、
Windowオブジェクトのclose()メソッドが呼び出される。

通常、自動的にウィンドウをクローズできるのは、JavaScriptコードで生成したウィンドウだけに限られる。
これ以外のウィンドウをクローズしようとすると、ダイアログボックスが表示され、ユーザーに確認が求められる。

参考書籍：

オライリー JavaScript 第6版

新たにWebブラウザウィンドウをオープンするには、Windowオブジェクトのopen()メソッドを使う。

Window.open()メソッド

var w = window.open("smallwin.html",    //新ウィンドウに表示するドキュメントのURL。
        "smallwin", //ウィンドウの名前を表す文字列
        "width=400, height=350, status=yes, resizable=yes");    //新しいウィンドウのサイズやGUIの詳細

1番目の引数：
省略かnullを指定で、about:blank URLが指定されたことになり、空白のページが表示される。

2番目の引数：
ウィンドウの名前を表す文字列。
同じ名前のウィンドウがすでに存在し、スクリプトからそのウィンドウに新しいページをロードできる場合は、
その既存ウィンドウが使われる。
それ以外の場合は、新しいウィンドウが作成され、指定された名前が設定される。

この引数を省略した場合は、「_blank」という、名前のない新しいウィンドウを開く。

3番目の引数：
新しいウィンドウのサイズやGUIの詳細を感まで区切って指定する。

4番目の引数：
論理値。2番目の引数に指定したウィンドウ名がすでに存在しているときに使われる。
trueの場合、ウィンドウの履歴の現在の項目は、1番目の引数で指定したURLに書き換えられる。
falseの場合、履歴に新しい項目が追加される。
省略はfalseになる。

var w = window.open();      //新たに空白のウィンドウを開く
 w.alert("About to visit http://example.com");   //alart()メソッドを呼び出す
 w.location = "http://example.com";  //locationプロパティを設定する。

window.open()メソッドを使って作成されたウィンドウ中では、openerプロパティを使って、
そのウィンドウを開いたスクリプトのWindowオブジェクトを取得できる。
そのほかのウィンドウの場合は、openerプロパティはnullになる。

参考書籍：

オライリー JavaScript 第6版

デスクトップ上の1つのブラウザウィンドウには、複数のタブが含まれる場合がある。
このタブごとに、別々のブラウジングコンテキストが存在する。
タブごとに、そのタブ用のWindowオブジェクトを持ち、他のタブのWindowオブジェクトとは独立している。

しかし、常に独立しているわけでもない。
あるタブ上やウィンドウのスクリプトから、新しいタブやウィンドウを開くことができる。
また、ドキュメントの操作もできる。(13.6.2項の同一出身ポリシーの成約を受ける)

HTMLドキュメントは、iframe要素を使って別のドキュメントを入れ子にできる。
iframe要素は、専用のWindowオブジェクトで表される入れ子になったブラウジングコンテキストを生成する。

入れ子型のブラウジングコンテキストは、通常のタブの場合と異なり、お互いに独立していない。
あるフレームで実行しているスクリプトは、祖先フレームや子孫フレームを調べられる。

参考書籍：

オライリー JavaScript 第6版

id属性を使って、HTMLドキュメント中に要素の名前を付け、Windowオブジェクトに同じ名前のプロパティが存在していなかった場合は、
Windowオブジェクトに、id属性の値と同じプロパティが追加される。

このプロパティには、ドキュメント要素を表す、HTMLElementオブジェクトが格納される。
つまり、HTMLドキュメント中で使用したid属性はグローバル変数となり、スクリプトからアクセスできる。

ただし、Windowオブジェクトに同じ名前のプロパティが存在している場合、プロパティは追加されない。
例えば、「history」、「location」、「navigator」というIDの要素は、グローバル変数からはアクセスできない。

var ui = ["input", "prompt", "heading"];    //要素のIDの配列
ui.forEach(function(id) {               //idごとに要素を検索し
    ui[id] = document.getElementById(id);   //プロパティに要素を格納する
});

上記コードを実行した後では、ui.input、ui.prompt、ui.heading がドキュメント要素を参照する。
スクリプトからは、ui.input、ui.heading の代わりに、input、heading というグローバル変数を使うことができる。
ただし、Windowオブジェクトには、prompt()メソッドがあるので、ui.prompt の代わりに、promptクローバル変数を使うことはできない。

代わりに、document、getElementById()と使って、明示的に検索するようにする。

var $ = function(id) { return document.getElementById(id); };
ui.prompt = $("prompt");

参考書籍：

オライリー JavaScript 第6版

Winowオブジェクトのonerrorプロパティは、イベントハンドラ
キャッチされない例外がコールスタックを伝播して、ブラウザのJavaScriptコンソールにエラーメッセージが表示される直前に、このイベントハンドラが呼び出される。
このプロパティに関数を格納すれば、そのウィンドウでJavaScriptエラーが発生するたびに、この関数が呼び出される。

window.onerror = function(msg, url, line) {
    if (onerror.num++ < onerror.max) {
        alert("ERROR: " + msg, "\n" + url + ":" + line);
        return true;
    }
}

onerror.max = 3;
error.num = 0;

参考書籍：

オライリー JavaScript 第6版

Windowオブジェクトには、簡単なダイアログボックスを表示するメソッドが3つある
alart()メソッド
confirm()メソッド
prompt()メソッド

    do {
        var name = prompt("What is your name?");    //文字列を取得する
        var correct = confirm("You entered '" + name + "'.\n" +     //論理値を取得する
            "Click Okay to proceed or Cancel to re-enter.");
    } while(!correct)
    alart("Hellow, " + name);       //メッセージを表示する

少し複雑な showModalDialog()メソッド もある

参考書籍：

オライリー JavaScript 第6版

Windowオブジェクトのscreenプロパティには、Screenオブジェクトへの参照が格納される。

Screenオブジェクト
画面サイズ、色などの情報を提供するプロパティがある。

width プロパティ
height プロパティ
availWidth プロパティ
availHight プロパティ
colorDepth プロパティ

参考書籍：

オライリー JavaScript 第6版

Windowオブジェクトのnavigatorプロパティには、Navigatorオブジェクトへの参照が格納される。
ブラウザのベンダーやブラウザーのバージョンについての情報が格納されている

4つのプロパティ
appName
appVersion
userAgent
platform

他にも以下のプロパティ、メソッドがある。
onLine
geolocation
javaEnabled()
cookiesEnabled()

example 14-3 navigator.userAgentを使ったブラウザテスト

/*
* クライアントテスト用に、browser.name と browser.version を定義する。 
* このコードは、jQuery1.4.1のコードを元にしている。
* 名前もバージョン番号も文字列。
* また公式のブラウザ名やバージョン番号と異なる場合がある。
* 判定する名前は以下。
* 
* "webkit": Safari または Chrome。バージョンはWebkitのビルド番号
* "opera": Operaブラウザ。バージョンは公式のバージョン番号
* "mozilla": Firefox、またはGeckoベースのブラウザ。バージョンはGeckoのバージョン
* "msie": IE。バージョンは公式のバージョン
*/
//例えば、Firefox3.6の場合の戻り値は、{ name: "mozilla", version: "1.9.2" }
var browser = (function() {
	var s = navigator.userAgent.toLowerCase();
	var match = /(webkit)[ \/]([\w.]+)/.exec(s) ||
		/(opera)(?:.*version)?[ \/]([\w.]+)/.exec(s) ||
		/(msie)([\w.]+)/.exec(s) ||
		!/compatible/.test(s) && /(mozilla)(?:.*? rv:([\w.]+))?/.exec(s) ||
		[];
	return { name: match[1] || "", version: match[2] || "0" };
}());

参考書籍：

オライリー JavaScript 第6版

Windowオブジェクトのhistoryプロパティには、対応するHistoryオブジェクトが格納される。

lengthプロパティ
閲覧履歴リスト中の項目数が格納される

back()メソッド、forward()メソッド
戻るBackボタンとForward進むボタンに相当する

go()
整数値を引数にとる
整数：値の数だけ進む
負数：値の数だけ戻る

history.go(-2);     //Backボタンを2回押したのと同様に、2つ戻る。

参考書籍：

オライリー JavaScript 第6版