JavaScript ウィンドウ - ブラウザ オブジェクト モデル

JavaScript ウィンドウ - ブラウザ オブジェクト モデル
ブラウザ オブジェクト モデル (BOM) は、JavaScript にブラウザと「対話」する機能を与えます。



Window オブジェクト
すべてのブラウザが window オブジェクトをサポートしています。ブラウザウィンドウを表します。
すべての JavaScript グローバル オブジェクト、関数、変数は自動的に window オブジェクトのメンバーになります。
グローバル変数はウィンドウオブジェクトのプロパティです。
グローバル関数はウィンドウオブジェクトのメソッドです。

HTML DOM のドキュメントもウィンドウ オブジェクトのプロパティの 1 つです:
window.document.getElementById("header");
これと同じ:



ウィンドウ サイズは 3 つあります
このメソッドは、ブラウザ ウィンドウ (ツールバーとスクロール バーを除くブラウザのビューポート) のサイズを決定します。
Internet Explorer、Chrome、Firefox、Opera、Safari の場合:
window.innerHeight - ブラウザ ウィンドウの内側の高さ
window.innerWidth - ブラウザ ウィンドウの内側の幅
Internet Explorer 8、7、6、5 の場合:
document. documentElement.clientHeight
document.documentElement.clientWidth
または
document.body.clientHeight
document.body.clientWidth

実用的な JavaScript ソリューション (すべてのブラウザをカバー):
var w=window.innerWidth
|| clientWidth
|| document.body.clientWidth;

var h=window.innerHeight
|| document.body.clientHeight



- 開く新しいウィンドウ
window.close() - 現在のウィンドウを閉じる
window.moveTo() - 現在のウィンドウを移動
window.resizeTo() - 現在のウィンドウのサイズを調整



ウィンドウ画面
window.screen オブジェクトには以下が含まれますユーザーの画面情報に関する情報。

一部のプロパティ:
screen.availWidth - 利用可能な画面の幅 (プロパティは、ウィンドウのタスクバーなどのインターフェイス機能を除いた、訪問者の画面の幅をピクセル単位で返します。)
screen.availHeight - 利用可能な画面の高さ (プロパティは、訪問者の画面 (ピクセル単位、ウィンドウ タスクバーなどのインターフェイス機能を除いたもの)



ウィンドウの場所
window.location オブジェクトは、現在のページのアドレス (URL) を取得し、ブラウザーを新しいページにリダイレクトするために使用されます。

location.hostname は Web ホストのドメイン名を返します
location.pathname は現在のページのパスとファイル名を返します
location.port は Web ホストのポート (80 または 443) を返します
location.protocol は Web アドレスを返します使用されるプロトコル (http://または https://) location.href プロパティは、現在のページの URL を返します。
location.assign() メソッドは新しいドキュメントを読み込みます。

例:
<script> <br></script>
http://www.w3school.com.cn/js/js_window_location .asp


location.assign と location.replace の違い
window.location.assign(url): URL で指定された新しい HTML ドキュメントを読み込みます。 指定した URL にジャンプするリンクに相当します。
「戻る」をクリックすると、前のページに戻ることができます。

window.location.replace(url): URLで指定されたドキュメントをロードして現在のドキュメントを置き換えます。
前後の2つのページは同じウィンドウを共有しているため、前のページに戻る方法です。



ウィンドウ履歴
history.back() - ブラウザの「戻る」ボタンをクリックするのと同じです (履歴リスト内の前の URL をロードします。)
history.forward() - ブラウザの「進む」ボタンをクリックするのと同じです (履歴リストの次の URL を読み込みます。)



Window Navigator window.navigator オブジェクトには、訪問者のブラウザに関する情報が含まれています。



JavaScript メッセージ ボックス
JavaScript で、警告ボックス、確認ボックス、プロンプト ボックスの 3 種類のメッセージ ボックスを作成します。

警告ボックス
警告ボックスが表示されたら、ユーザーは [OK] ボタンをクリックして操作を続行する必要があります。
構文:
alert("text")


確認ボックス
確認ボックスが表示されたら、ユーザーは [OK] または [キャンセル] ボタンをクリックして操作を続行する必要があります。
ユーザーがクリックして確認すると、戻り値は true になります。ユーザーが「キャンセル」をクリックすると、戻り値は false になります。

構文:
confirm("text")

例:



プロンプト ボックスが表示されたら、ユーザーは特定の値を入力し、確認またはキャンセル ボタンをクリックする必要があります。操作。
ユーザーが確認のためにクリックした場合、戻り値は入力された値です。ユーザーが「キャンセル」をクリックすると、戻り値は null になります。

構文:
prompt("text","デフォルト値")

例:




JavaScript のタイミング
JavaScript を使用すると、関数が呼び出された直後にコードを実行するのではなく、設定された時間間隔後にコードを実行することができます。これをタイミング イベントと呼びます。

setTimeout()
構文
var t=setTimeout("javascript ステートメント", ミリ秒)
最初のパラメーターは、JavaScript ステートメントを含む文字列です。このステートメントは、「alert('5 秒!')」、または関数の呼び出し

例: (無限ループ)


clearTimeout ()
構文
clearTimeout(setTimeout_variable) //setTimeout_variable は作成時のタイマー参照 (変数) です

例:
function stopCount()
{
clearTimeout(t)
}




JavaScript Cookie
Cookie は、訪問者のコンピューターに保存される変数です。この Cookie は、同じコンピュータがブラウザを通じてページを要求するたびに送信されます。
JavaScript を使用して Cookie 値を作成および取得できます。

Cookie は、キーと値のペアの形式、つまりキー=値の形式で保存されます。通常、各 Cookie は「;」で区切られます。
document.cookie = "name=value;expires=date;path=path"
document.cookie = "username=Darren;path=/;domain=qq.com"

Cookie を作成して保存する
function setCookie(c_name, value,expiredays)
{
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "= +escape(value)+
((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
}

Cookie を読み取る
function getCookie(c_name)
{
if (document.cookie.length>0) // document.cookie オブジェクトを確認するCookie があります
{
c_start=document.cookie.indexOf(c_name + "=")
if (c_start!=-1)
(";",c_start)
if (c_end==-1) c_end=document .cookie.length
return unescape(document.cookie.substring(c_start,c_end))
}
}
return ""
}


Cookieの有効期間を設定します
デフォルトでは、Cookieはブラウザの起動時に自動的にクリアされますは閉鎖されていますが、Cookie の有効期間を期限切れまで設定できます。
document.cookie = "名前=値;有効期限=日付"