JS中的BOM操作(一)
目錄
Tips
1.BOM簡介
JavaScript分三個部分:
1. ECMAScript標準---基本語法
2. DOM--->Document Object Model 文件物件模型,操作頁面元素的
3. BOM--->Browser Object Model 瀏覽器物件模型,操作瀏覽器的
瀏覽器中有個頂級物件:window----皇上
頁面中頂級物件:document-----總管太監
頁面中所有的內容都是屬於瀏覽器的,頁面中的內容也都是window的,因為頁面中的所有內容都是window的,window是可以省略的.
變數是window的
2.對話方塊
window.alert("您好啊");//以後不用,測試的時候使用
window.prompt("請輸入帳號");
var result=window.confirm("您確定退出嗎");
3.載入事件
只要頁面載入完畢,這個事件就會觸發-----頁面中所有的內容,標籤,屬性,文字,包括外部引入js檔案
window.onload=function () {
document.getElementById("btn").onclick=function () {
alert("您好");
};
};
很重要
onload=function () {
document.getElementById("btn").onclick=function () {
alert("您好");
};
};
擴充套件的事件---頁面關閉後才觸發的事件
window.onunload=function () {
};
擴充套件事件---頁面關閉之前觸發的
window.onbeforeunload=function () {
alert("哈哈");
};
4.location物件
location物件
console.log(window.location);
// //位址列上#及後面的內容
// console.log(window.location.hash);
// //主機名及埠號
// console.log(window.location.host);
// //主機名
// console.log(window.location.hostname);
// //檔案的路徑---相對路徑
// console.log(window.location.pathname);
// //埠號
// console.log(window.location.port);
// //協議
// console.log(window.location.protocol);
// //搜尋的內容
// console.log(window.location.search);
//設定跳轉的頁面的地址
//location.href="http://www.jd.com";//屬性----------------->必須記住
//location.assign("http://www.jd.com");//方法
//location.reload();//重新載入--重新整理
//location.replace("http://www.jd.com");//沒有歷史記錄
5.history物件
//跳轉的
my$("btn1").onclick = function () {
window.location.href = "15test.html";
};
//前進
my$("btn2").onclick = function () {
window.history.forward();
};
6.navigator物件
//通過userAgent可以判斷使用者瀏覽器的型別
console.log(window.navigator.userAgent);
//通過platform可以判斷瀏覽器所在的系統平臺型別.
//console.log(window.navigator.platform);