ホームページ > 記事 > ウェブフロントエンド > JavaScript Web プログラミング-----ブラウザ オブジェクト モデル (BOM)
JavaScript Web プログラミング-----ブラウザ オブジェクト モデル (BOM)
- 黄舟オリジナル
- 2016-12-30 16:33:591132ブラウズ
ブラウザ オブジェクト
モデル: BOM
主にウィンドウ オブジェクトについて説明します: ブラウザで開いているウィンドウを表します
1. BOM 関数
は、ブラウザ ウィンドウなどのブラウザのさまざまな機能コンポーネントへのアクセスを提供します。ウィンドウ自体、閲覧履歴など
2. ウィンドウ内のイベント
3 つのロード イベント (ブラウザのライフサイクル): onload、onunload、onbeforeunload (ただし、単語から意味を確認することもできます。その他のイベントについては、ヘルプドキュメントは自分で確認できます)
<!DOCTYPE html>
<html>
<head>
<title>bom_window_event.html</title>
</head>
<body>
<script type="text/javascript">
//事件注册
onload=function(){
//alert("onload...");
window.open("ad.html","_blank","height=300,width=300,status=no,toolbar=no,menubar=no,location=no");
}
/*
onunload=function(){
alert("onunload...");
}
onbeforeunload=function(){
alert("onbeforeunload...");
}
*/
</script>
</body>
</html>3. ウィンドウ内のメソッド
<!DOCTYPE html>
<html>
<head>
<title>bom_window_method.html</title>
</head>
<body>
<script type="text/javascript" src="print.js">
</script>
<script type="text/javascript">
//window中的方法
function f1(){
var b = confirm("你确定要执行吗？");
alert("b="+b);
}
var id1,id2;
function f2(){
// id1 = setTimeout("alert('time out...')" , 3000);//经过指定毫秒值后计算一个表达式----定时器
id2 = setInterval("alert('time out...')" , 3000);//每经过指定毫秒值后计算一个表达式----定时器
}
function f3(){
//clearTimeout(id1);
clearInterval(id2);//清除定时器
}
function f4(){
//moveBy(10,10);//浏览器窗口----相对移动，向右下角移动(水平与垂直方向分别移动10像素)
//moveTo(40,40);
//窗口抖动
for(var x=0;x<10;x++){
moveBy(20,0);
moveBy(0,20);
moveBy(-20,0);
moveBy(0,-20);
}
}
</script>
<input type="button" value="演示window中的方法1--确认提示窗口" onclick="f1()" /><br/>
<input type="button" value="演示window中的方法2--定时器1" onclick="f2()" /><br/>
<input type="button" value="演示window中的方法2--定时器2" onclick="f3()" /><br/>
<input type="button" value="演示window中的方法3--move" onclick="f4()" /><br/>
</body>
</html> 4. ウィンドウ内のオブジェクト
1. ウィンドウ内のナビゲーターオブジェクト ---- ブラウザ情報
function windowNavigatorShow(){
var name = window.navigator.appName;
//var version = window.navigator.appVersion;
var version = navigator.appVersion;//window对象是默认的，可以省略不写
println("name:"+name+",version:"+version);
}2. ウィンドウ ブラウザアドレス内の位置オブジェクトbar
<span style="font-weight: normal;">function windowObj4(){
//获取属性
var pro = window.location.protocol; //window可省略
//alert(pro);
var text = location.href;
alert(text);
location.href="http://www.baidu.com.cn";//1
location.href ="5a.html";//2
//上两句1和2处可以对目前所处的地址进行更改，这就是在浏览器中浏览到某些东西时突然会跳到其他页面去的原理，如1会自动跳转到百度
}</span>5a.html
<html>
<head>
<title>aa</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<script type="text/javascript">
function windowObjDemo(){
history.back();
}
</script>
<input type="button" value="演示window中的对象" onclick="windowObjDemo()" />
</body>
</html>3. ウィンドウ内の履歴オブジェクト----ブラウザが閲覧したURL情報
メソッド:
back From 以前のURLを履歴リストにロードします。
forward 履歴リストから次の URL を読み込みます。
go 履歴リストから URL を読み込みます。
<input type="button" value="演示window中的对象3--history,后退" onclick="history.back()" />
上記は JavaScript Web プログラミングの内容です -- ブラウザ オブジェクト モデル (BOM) の関連コンテンツについては、PHP 中国語 Web サイト (www.php.cn) に注目してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。