當前位置:學問君>人在職場>電腦培訓>

javascript學習筆記:window對象使用介紹

學問君 人氣:9.99K

1.視窗位置

javascript學習筆記:window對象使用介紹

以下取得瀏覽器視窗距屏幕左邊和上邊的位置

複製代碼 代碼如下:

var leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX; //左邊位置

var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY; //上邊位置

2.瀏覽器大小

以下取得瀏覽器頁面視口的大小

複製代碼 代碼如下:

var pageWidth = window.innerWidth,

pageHeight = window.innerHeight;

if (typeof pageWidth != "number") {

if (document.compatMode == "CSS1Compat") {

pageWidth = document.documentElement.clientWidth;

pageHeight = document.documentElement.clientHeight;

} else {

pageWith = document.body.clientWdith;

pageHeight = document.body.clientHeight;

}

}

3.開啟或彈出視窗

window.open()方法,可以接受4個參數,通常只需指定第一個參數,第一個參數爲URL,第二個參數爲_self 、_parent 、_top 、_blank 或者框架名

複製代碼 代碼如下:

window.open("http://www.baidu.com");

window.open("http://www.baidu.com","_blank");

window.open("http://www.baidu.com","topFrame","height=400,width=400,top=10,left=10,resizable = yes");

topFrame.resizeTo(500,300); //調整視窗大小

topFrame.moveTo(100,100); //移動視窗位置

topFrame.close(); //關閉新開啟的視窗,IE會報錯

4.location 對象

location.href(URL) 加載URL

複製代碼 代碼如下:

location.href(URL) 加載URL

location.href("http://www.baidu.com");

location.href = "http://www.baidu.com" ; //同上

location.assign = "http://www.baidu.com"; //同上

window.loaction = "http://www.baidu.com"; //同上

location.replace("http://www.baidu.com"); //同上,但不能回退

location.reload(); //重新加載(可能從快取中加載)

location.reload(true); //重新加載(從服務器中加載)

location.search() 返回URL中的查詢字元串,字元串以爲?開頭

5.獲取查詢字元串參數

複製代碼 代碼如下:

function getQueryStringArgs() {

var qs = (location.search.length > 0) location.search.substring(1) : "";

var args ={};

var items = qs.split("&");

var item = null,name = null,value = null;

for (var i=0 ; i<items.length ; i++)

{

item = itmes[i].split("=");

name = decodeURIComponent(item[0]);

value = decodeURIComponent(item[1]);

args[name] = value;

}

return args;

}

//假設查詢字元串參數是?q=javascript&num=10

var args = getQueryStringArgs();

alert(args["q"]); //"javascript"

alert(args["num"]); //"10"

6.history 對象

複製代碼 代碼如下:

history.go()頁面跳轉

history.go(-1); //後退一頁

history.go(1); //前進一頁

history.go(2); //前進兩頁

history.go("baidu.com"); 跳轉到最近的'baidu.com頁面

history.back(); //後退一頁

history.forword(); //前進一頁

檢測當前頁是不是用戶開啟的第一個頁面

複製代碼 代碼如下:

if (history.length == 0) {

//如果開啟的是第一個頁面的話,執行某些操作

}

7.頁面加載

window.onload() 用於頁面加載結束後做某些操作

複製代碼 代碼如下:

window.onload = function () {

//執行某些操作

}