摘要:對象的核心對象是,它表示瀏覽器的一個(gè)實(shí)例。而和則表示該容器中頁面視圖區(qū)的大小。在中,與返回相同的值,即視口大小而非瀏覽器窗口大小。第三個(gè)參數(shù)是一個(gè)逗號分隔的設(shè)置字符串,表示在新窗口中都顯示哪些特性。這應(yīng)該是用戶打開窗口后的第一個(gè)頁面
BOM window對象
BOM的核心對象是window,它表示瀏覽器的一個(gè)實(shí)例。在瀏覽器中,window對象有雙重角色,它既是通過JavaScript訪問瀏覽器窗口的一個(gè)接口,又是ECMAScript規(guī)定的Global對象。這以為著在網(wǎng)頁中定義的任何一個(gè)對象、變量和函數(shù),都是以window作為其Global對象,因此有權(quán)訪問parseInt()等方法。
全局作用域var age=29; function sayAge(){ alert(this.age); } alert(window.age);//29 sayAge();//29 window.sayAge();//29
全局變量不能通過delete操作符刪除,而直接在window對象上的定義的屬性可以
var age=29; window.color="red"; //在IE<9時(shí)拋出錯(cuò)誤,在其他所有瀏覽器中都返回false delete window.age; //在IE<9時(shí)拋出錯(cuò)誤,在其他所有瀏覽器中都返回true delete window.color;//return true alert(window.age);//29 alert(window.color);//undefined
嘗試訪問未聲明的變量會(huì)拋出錯(cuò)誤,但是通過查詢window對象,可以知道某個(gè)可能未聲明的變量是否存在
//這里會(huì)拋出錯(cuò)誤,因?yàn)閛ldValue未定義 var newValue=oldValue //這里不會(huì)拋出錯(cuò)誤,因?yàn)檫@是一次屬性查詢 //newValue的值是undefined var newValue=window.oldValue窗口關(guān)系及框架
如果頁面中包含框架,則每個(gè)框架都擁有自己的window對象,并且保存在frames集合中
Frameset Example
在使用框架的情況下,瀏覽器中會(huì)存在多個(gè)Global對象。在每個(gè)框架中定義的全局變量會(huì)自動(dòng)成為框架中window對象的屬性。由于每個(gè)window對象都包含原生類型的構(gòu)造函數(shù),因此每個(gè)框架都有一套自己的構(gòu)造函數(shù),這些構(gòu)造函數(shù)一一對應(yīng),但并不相等。
窗口位置
screenLeft()和screenTop()屬性,分別用于表示窗口相對于屏幕左邊和上邊的位置
var leftPos=(typeof window.screenLeft=="number")?window.screenLeft:window.screenX; var topPos=(typeof window.screenTop=="number")?window.screenTop:window.screenY;
moveTo()接收的是新位置的x和y的坐標(biāo)值,而moveBy()接收的是在水平和垂直方向上移動(dòng)的像素?cái)?shù)
//將窗口移動(dòng)到屏幕左上角 window.moveTo(0,0); //將窗口向下移動(dòng)100像素 window.moveBy(0,100); //將窗口移動(dòng)到(200,300) window.moveTo(200,300); //將窗口向左移動(dòng)50像素 window.moveBy(-50,0)
這兩個(gè)方法可能會(huì)被瀏覽器禁用。這兩個(gè)方法不適用于框架,只能對最外層的window對象使用
窗口大小在IE9+、Safari和FireFox中,outerWidth和outerHeight返回瀏覽器窗口本身的尺寸。在Opera中,這兩個(gè)屬性的值表示頁面視圖容器的大小。而innerWidth和innerHeight則表示該容器中頁面視圖區(qū)的大小。在Chrome中,outerWidth、outerHeight與innerWidth、innerHeight返回相同的值,即視口大小而非瀏覽器窗口大小。
使用resizeTo()和resizeBy()方法可以調(diào)整瀏覽器窗口的代銷。這兩個(gè)方法都接收兩個(gè)參數(shù),其中resizeTo()接收瀏覽器窗口的新寬度和高度,而resizeBy()接收新窗口與原窗口的寬度和高度之差。
//調(diào)整到100X100 window.resizeTo(100,100); //調(diào)整到200X150 window.resizeBy(100,50) //調(diào)整到300X300 window,resizeTo(300,300)
這兩種方法也有可能被瀏覽器禁用
導(dǎo)航和打開窗口window.open()方法既可以導(dǎo)航到一個(gè)特定的URL,也可以打開一個(gè)新的瀏覽器窗口
這個(gè)方法接收4個(gè)參數(shù):要加載的URL、窗口目標(biāo)、一個(gè)特性字符串以及一個(gè)表示新頁面是否取代瀏覽器歷史記錄中當(dāng)前加載頁面的布爾值。通常只需傳遞第一個(gè)參數(shù),最后一個(gè)參數(shù)只在不打開新窗口的情況下使用。
如果為window.open()傳遞了第二個(gè)參數(shù),而且該參數(shù)是已有窗口或框架的名稱,那么就會(huì)在具有該名稱的窗口或框架中加載第一個(gè)參數(shù)指定的URL。
如果給 window.open() 傳遞的第二個(gè)參數(shù)并不是一個(gè)已經(jīng)存在的窗口或框架,那么該方法就會(huì)根據(jù)在第三個(gè)參數(shù)位置上傳入的字符串創(chuàng)建一個(gè)新窗口或新標(biāo)簽頁。如果沒有傳入第三個(gè)參數(shù),那么就會(huì)打開一個(gè)帶有全部默認(rèn)設(shè)置(工具欄、地址欄和狀態(tài)欄等)的新瀏覽器窗口(或者打開一個(gè)新標(biāo)簽頁根據(jù)瀏覽器設(shè)置)。
第三個(gè)參數(shù)是一個(gè)逗號分隔的設(shè)置字符串,表示在新窗口中都顯示哪些特性。
允許通過設(shè)置超時(shí)值和間歇時(shí)間值來調(diào)度代碼在特定的時(shí)刻執(zhí)行。前者是在指定的時(shí)間過后執(zhí)行代碼,后者是每隔指定的時(shí)間就執(zhí)行一次代碼。
超時(shí)調(diào)用setTimeout(),接收兩個(gè)參數(shù):要執(zhí)行的代碼和以毫秒表示的時(shí)間。
間歇調(diào)用與超時(shí)調(diào)用類似,只不過它會(huì)按照指定的時(shí)間間隔重復(fù)執(zhí)行代碼,直至間歇調(diào)用被取消或者頁面被卸載。設(shè)置間歇調(diào)用的方法是setInterval(),它接收的參數(shù)與setTimeout()相同
系統(tǒng)對話框瀏覽器通過alert()、confirm()和prompt()方法可以調(diào)用系統(tǒng)對話框向用戶顯示消息。
alert()方法,這個(gè)方法接受一個(gè)字符串并將其展示給用戶。調(diào)用alert()方法的結(jié)果就是想用戶顯示一個(gè)系統(tǒng)對話框,其中包含指定文本和一個(gè)OK("確定")按鈕
confirm()方法,像是一個(gè)"警告"對話框。除了顯示"確定"按鈕之外,還會(huì)顯示一個(gè)Cancel("取消")按鈕,兩個(gè)按鈕可以讓用戶決定是否執(zhí)行給定的操作
if (confirm("Are you sure?")) { alert("I"m so glad you"re sure! "); } else { alert("I"m sorry to hear you"re not sure. "); }
prompt()方法,生成提示框,用于提示用戶輸入一些文本。除了顯示OK和Cancel按鈕之外,還會(huì)顯示一個(gè)文本提示域。默認(rèn)接收兩個(gè)參數(shù),要顯示給用戶的文本提示和文本輸入域的默認(rèn)值
location對象 查詢字符串參數(shù)
創(chuàng)建函數(shù),解析查詢字符串,返回包含所有參數(shù)的一個(gè)對象
function getQueryStringArgs(){ //取得查詢字符串并去掉開頭的問號 var qs = (location.search.length > 0 ? location.search.substring(1) : ""), //保存數(shù)據(jù)的對象 args = {}, //取得每一項(xiàng) items = qs.length ? qs.split("&") : [], item = null, name = null, value = null, //在 for 循環(huán)中使用 i = 0, len = items.length; //逐個(gè)將每一項(xiàng)添加到 args 對象中 for (i=0; i < len; i++){ item = items[i].split("="); name = decodeURIComponent(item[0]); value = decodeURIComponent(item[1]); if (name.length) { args[name] = value; } } return args; }位置操作
使用 location 對象可以通過很多方式來改變?yōu)g覽器的位置。首先,也是最常用的方式,就是使用assign() 方法并為其傳遞一個(gè) URL。
location.assign("http://www.wrox.com");
下面兩行代碼與顯式調(diào)用assign()方法的效果完全一樣
window.location = "http://www.wrox.com"; location.;
//假設(shè)初始 URL 為 http://www.wrox.com/WileyCDA/ //將 URL 修改為"http://www.wrox.com/WileyCDA/#section1" location.hash = "#section1"; //將 URL 修改為"http://www.wrox.com/WileyCDA/?q=javascript" location.search = "?q=javascript"; //將 URL 修改為"http://www.yahoo.com/WileyCDA/" location.hostname = "www.yahoo.com"; //將 URL 修改為"http://www.yahoo.com/mydir/" location.pathname = "mydir"; //將 URL 修改為"http://www.yahoo.com:8080/WileyCDA/" location.port = 8080navigator對象 檢測插件
非IE瀏覽器可以使用plugins數(shù)組來達(dá)到這個(gè)目的
name,插件的名字
description,插件的描述
filename,插件的文件名
length,插件所處理的MIME類型數(shù)量
//檢測插件(在 IE 中無效) function hasPlugin(name){ name = name.toLowerCase(); for (var i=0; i < navigator.plugins.length; i++){ if (navigator. plugins [i].name.toLowerCase().indexOf(name) > -1){ return true; } } return false; } //檢測 Flash alert(hasPlugin("Flash")); //檢測 QuickTime alert(hasPlugin("QuickTime"));注冊處理程序
registerContentHandler() 和 registerProtocolHandler() 方法。這兩個(gè)方法可以讓一個(gè)站點(diǎn)指明它可以處理特定類型的信息。
screen對象screen對象基本上只用來表明客戶端的能力,其中包括瀏覽器窗口外部的顯示器的信息,如像素的寬度高度等
history對象
使用 go() 方法可以在用戶的歷史記錄中任意跳轉(zhuǎn),可以向后也可以向前。這個(gè)方法接受一個(gè)參數(shù),表示向后或向前跳轉(zhuǎn)的頁面數(shù)的一個(gè)整數(shù)值。負(fù)數(shù)表示向后跳轉(zhuǎn)(類似于單擊瀏覽器的“后退”按鈕),正數(shù)表示向前跳轉(zhuǎn)(類似于單擊瀏覽器的“前進(jìn)”按鈕)。
//后退一頁 history.go(-1); //前進(jìn)一頁 history.go(1); //前進(jìn)兩頁 history.go(2);
也可以給 go() 方法傳遞一個(gè)字符串參數(shù),此時(shí)瀏覽器會(huì)跳轉(zhuǎn)到歷史記錄中包含該字符串的第一個(gè)位置——可能后退,也可能前進(jìn),具體要看哪個(gè)位置最近。如果歷史記錄中不包含該字符串,那么這個(gè)方法什么也不做,
//跳轉(zhuǎn)到最近的 wrox.com 頁面 history.go("wrox.com"); //跳轉(zhuǎn)到最近的 nczonline.net 頁面 history.go("nczonline.net");
還可以使用兩個(gè)簡寫方法 back() 和 forward() 來代替 go() 。
//后退一頁 history.back(); //前進(jìn)一頁 history.forward();
history 對象還有一個(gè) length 屬性,保存著歷史記錄的數(shù)量。
if (history.length == 0){ //這應(yīng)該是用戶打開窗口后的第一個(gè)頁面 }
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/97726.html
摘要:簡介簡史誕生于年,當(dāng)時(shí)主要負(fù)責(zé)表單的輸入驗(yàn)證。實(shí)現(xiàn)一個(gè)完整的由三部分組成核心文檔對象模型瀏覽器對象模型就是對實(shí)現(xiàn)該標(biāo)準(zhǔn)規(guī)定的各個(gè)方面內(nèi)容的語言的描述。把整個(gè)頁面映射為一個(gè)多層節(jié)點(diǎn)結(jié)構(gòu)。由萬維網(wǎng)聯(lián)盟規(guī)劃。主要目標(biāo)是映射文檔的結(jié)構(gòu)。 JavaScript簡介 JavaScript簡史 JavaScript誕生于1995年,當(dāng)時(shí)主要負(fù)責(zé)表單的輸入驗(yàn)證。 如果沒有表單驗(yàn)證的功能,填入信息之...
摘要:匿名函數(shù)可以用來模仿塊級作用域來避免這個(gè)問題這里是塊級作用域代碼定義并立即調(diào)用了一個(gè)匿名函數(shù),將函數(shù)聲明包含在一對圓括號中,表示它實(shí)際上是一個(gè)函數(shù)表達(dá)式,而緊隨其后的另一對圓括號會(huì)立即調(diào)用這個(gè)函數(shù)。 函數(shù)表達(dá)式 遞歸 遞歸函數(shù)是在一個(gè)函數(shù)通過名字調(diào)用自身的情況下構(gòu)成的 function factrial(num){ if(num
摘要:能力檢測無法精確地檢測特定的瀏覽器和版本。用戶代理檢測通過檢測用戶代理字符串來識別瀏覽器。用戶代理檢測需要特殊的技巧,特別是要注意會(huì)隱瞞其用戶代理字符串的情況。 客戶端檢測 能力檢測 能力檢測的目的不是識別特定的瀏覽器,而是識別瀏覽器的能力,采用這種方式不必顧忌特定的瀏覽器,只要確定瀏覽器支持的特定的能力,就能給出解決方案,檢測基本模式 if(object.propertyInQu...
摘要:操作類名時(shí)可以通過屬性添加刪除和替換類名。如果將可選的參數(shù)設(shè)置為,則表示盡量將元素顯示在視口中部垂直方向。將元素的內(nèi)容滾動(dòng)指定的頁面高度,具體高度由元素的高度決定。 DOM擴(kuò)展 選擇符API querySelector()方法 querySelector()方法接收一個(gè)CSS選擇符,返回與該模式匹配的第一個(gè)元素,如果沒有找到匹配的元素,返回null //取得body元素 var b...
摘要:基本概念語法區(qū)分大小寫,中的一切變量函數(shù)名和操作符都區(qū)分大小寫。要將一個(gè)值轉(zhuǎn)換成對應(yīng)的值,可以調(diào)用類型包括整數(shù)和浮點(diǎn)數(shù)值,基本數(shù)值字面量格式是十進(jìn)制整數(shù),除了十進(jìn)制外還有八進(jìn)制十六進(jìn)制。八進(jìn)制第一位必須是,十六進(jìn)制第一位必須是。 基本概念 語法 區(qū)分大小寫,ECMAScript中的一切(變量、函數(shù)名和操作符)都區(qū)分大小寫。函數(shù)名不能使用typeof,因?yàn)樗且粋€(gè)關(guān)鍵字,但typeOf...
閱讀 2875·2023-04-25 20:02
閱讀 1477·2021-11-11 16:55
閱讀 652·2021-09-26 09:46
閱讀 6256·2021-09-22 15:55
閱讀 1853·2021-08-09 13:41
閱讀 1599·2019-08-30 15:52
閱讀 2406·2019-08-30 14:13
閱讀 3337·2019-08-26 13:48