Javascript Bom概念及び常用アプリ
6627 ワード
BOM概要
JavaScriptの実現には以下の3つの部分が含まれています.
1.核心(ECMAScript):JSの文法と基本的なオブジェクトを説明しました.
2.文書オブジェクトモデル(DOM):ページの内容を処理する方法とインターフェース
3.ブラウザオブジェクトモデル(BOM):ブラウザと対話する方法とインターフェース
BOMはBrowser Object Modelであり、ブラウザのオブジェクトモデルであり、BOMはブラウザのウィンドウまたはソフトウェアを専門に操作するAPIを提供している.BOMの核心はwindowで、windowの対象はまた二重の役を持って、それはjsを通じてブラウザーのウィンドウの1つのインターフェイスに訪問するので、また1つのGlobal(大域)の対象です.
BOMオブジェクト
BOM対象は以下の通りです
windowオブジェクトは、JSの最上階のオブジェクトで、他のBOMオブジェクトはすべてwindowオブジェクトのプロパティです.
オブジェクト、ドキュメントオブジェクト;
locationオブジェクトは、ブラウザの現在のURL情報です.
navigatorの対象は、ブラウザ自身の情報です.
screenオブジェクト、クライアント画面情報、ユーザ機器の種類を取得することができます.
historyオブジェクト、ブラウザアクセス履歴情報
windowオブジェクト
ボックスクラス:
1.現在のウィンドウで開くと、後ろに下がることができます.
html:
js:
3.新しいウィンドウで開くと、複数のウィンドウを開くことができます.
html:
html:
事前定義name:_selfは現在のウィンドウのname_を自動的に使用します.ウィンドウ名は指定されていません.ウィンドウを開くたびに、ブラウザが自動的に内部ウィンドウ名をランダムに生成します.
ウィンドウを閉じる
タイマー/クリアタイマ
使い捨てタイマー:
locationオブジェクト
現在のウィンドウが開いているurlアドレスのオブジェクトを保存します.
属性
使い方
1.現在のウィンドウで開くと、後ろに戻ります.
通常の更新:まずキャッシュから資源を取得し、キャッシュがないか、または期限が切れていない場合、サーバーに探しに行きます.
navigatorオブジェクトにはすべてのブラウザの設定情報が含まれています.
ユーザがIEブラウザかどうかを判断する.
historyオブジェクトは現在のウィンドウを保存して開けた後、成功的に訪れたurlの歴史記録スタックです.内容は開発者に開放されておらず、修正できず、三つの操作しかできません.
前に進む:
後退:
screenオブジェクトは、ユーザ画面に関する情報を含む.
JavaScriptの実現には以下の3つの部分が含まれています.
1.核心(ECMAScript):JSの文法と基本的なオブジェクトを説明しました.
2.文書オブジェクトモデル(DOM):ページの内容を処理する方法とインターフェース
3.ブラウザオブジェクトモデル(BOM):ブラウザと対話する方法とインターフェース
BOMはBrowser Object Modelであり、ブラウザのオブジェクトモデルであり、BOMはブラウザのウィンドウまたはソフトウェアを専門に操作するAPIを提供している.BOMの核心はwindowで、windowの対象はまた二重の役を持って、それはjsを通じてブラウザーのウィンドウの1つのインターフェイスに訪問するので、また1つのGlobal(大域)の対象です.
BOMオブジェクト
BOM対象は以下の通りです
windowオブジェクトは、JSの最上階のオブジェクトで、他のBOMオブジェクトはすべてwindowオブジェクトのプロパティです.
オブジェクト、ドキュメントオブジェクト;
locationオブジェクトは、ブラウザの現在のURL情報です.
navigatorの対象は、ブラウザ自身の情報です.
screenオブジェクト、クライアント画面情報、ユーザ機器の種類を取得することができます.
historyオブジェクト、ブラウザアクセス履歴情報
windowオブジェクト
ボックスクラス:
alert(' ')
confirm(" ")
prompt(" ")
ウィンドウを開く(4種類):1.現在のウィンドウで開くと、後ろに下がることができます.
html:
js:open("url","_self ")
2.現在のウィンドウで開け、後退禁止js:
location.replace(" url")
、historyの現在のアドレスを新しいurlで代替します.3.新しいウィンドウで開くと、複数のウィンドウを開くことができます.
html:
js:open("url","_blank ")
4.新しいウィンドウで開くには、一つだけ開けます.html:
js:open("url"," ")
原理:target属性は実は新しいウィンドウのためにメモリの中で唯一のウィンドウ名を指定して、ブラウザは規定して、同一の時刻、同名のウィンドウは一つだけ開けて、後で開けたのは上書きして先に開けます.事前定義name:_selfは現在のウィンドウのname_を自動的に使用します.ウィンドウ名は指定されていません.ウィンドウを開くたびに、ブラウザが自動的に内部ウィンドウ名をランダムに生成します.
ウィンドウを閉じる
close()
は現在のウェブページを閉じて、互換性の問題があります.FF:ブラウザを閉じるコードの設定を禁止します.Chrome:デフォルトで直接閉じます.IE:ユーザーに問い合わせてください.タイマー/クリアタイマ
使い捨てタイマー:
setTimeout( , )
周期性タイマー:setInterval( , )
タイマークリア:clearTimeout/clearInterval( )
非同期、同時実行の順序については、この文章の一つの文章を徹底的に紹介します.同期、setTimeout、Promise、asynclocationオブジェクト
現在のウィンドウが開いているurlアドレスのオブジェクトを保存します.
属性
location:http://aaaa.cn:8080/orders/orderDetails/index.html?username=nan&kw=
以上のドメイン名でプレゼンテーションを行います.location.protocal
:プロトコル名(http)location.host
:ホスト名+ポート番号(aa.cn:8080)location.hostname
:ホスト名(aaa.cn)location.port
:ポート番号(8080)location.pathname
:相対パス(orders/order Details/index)location.search
:その後の検索文字列(?username=nan&kw=楠)location.hash
:菗錨点呼使い方
1.現在のウィンドウで開くと、後ろに戻ります.
location.href="url";
location.assign("url"); //assign
location="url"; // href
2.現在のウィンドウで開け、後退禁止:// url, url history url,
location.replace(" url")
3.更新:通常の更新:まずキャッシュから資源を取得し、キャッシュがないか、または期限が切れていない場合、サーバーに探しに行きます.
F5
history.go(0)
location.reload()
強制更新:キャッシュの有無にかかわらず、サーバから新しいリソースを強制的に取得します.location.reload(true)
navigatorオブジェクトnavigatorオブジェクトにはすべてのブラウザの設定情報が含まれています.
navigator.platform
:オペレーティングシステムタイプ.navigator.userAgent
:ブラウザで設定されたUser-Agent文字列.navigator.appName
:ブラウザ名;navigator.appVersion
:ブラウザバージョン;navigator.language
:ブラウザで設定された言語.navigator.cookieEnabled
:クッキーが有効かどうかを判断する(trueは有効です)navigator.plugins
—指定プラグインがインストールされているかどうかを判断するセットです.ユーザがIEブラウザかどうかを判断する.
if(window.navigator.userAgent.indexOf('MSIE')!=-1){
alert(' IE');
}else{
alert(' IE');
}
history対象historyオブジェクトは現在のウィンドウを保存して開けた後、成功的に訪れたurlの歴史記録スタックです.内容は開発者に開放されておらず、修正できず、三つの操作しかできません.
前に進む:
history.go(1);
/前に進む後退:
history.go(-1);
更新:history.go(0);
screenオブジェクトscreenオブジェクトは、ユーザ画面に関する情報を含む.
screen.availWidth
は、ウィンドウタスクバーなどのインターフェース特性を減算するために、訪問者画面の幅を返します.screen.availHeight
は、ウィンドウタスクバーなどのインターフェース特性を減算するために、訪問者画面の高さを返します.//
document.write(screen.availHeight+screen.availWidth);