Window對(duì)象

Window 對(duì)象表示瀏覽器中打開的窗口。

如果文檔包含框架（<frame> 或 <iframe> 標(biāo)簽）雪营，瀏覽器會(huì)為 HTML 文檔創(chuàng)建一個(gè) window 對(duì)象，并為每個(gè)框架創(chuàng)建一個(gè)額外的 window 對(duì)象按咒。

Note

注意： 沒有應(yīng)用于 window 對(duì)象的公開標(biāo)準(zhǔn)瞒窒，不過所有瀏覽器都支持該對(duì)象。

CONTENT

Window 對(duì)象屬性

屬性	描述
closed	返回窗口是否已被關(guān)閉恋技。
defaultStatus	設(shè)置或返回窗口狀態(tài)欄中的默認(rèn)文本拇舀。
document	對(duì) Document 對(duì)象的只讀引用。(請(qǐng)參閱對(duì)象)
frames	返回窗口中所有命名的框架蜻底。該集合是 Window 對(duì)象的數(shù)組骄崩，每個(gè) Window 對(duì)象在窗口中含有一個(gè)框架。
length	設(shè)置或返回窗口中的框架數(shù)量。
history	對(duì) History 對(duì)象的只讀引用要拂。請(qǐng)參數(shù) History 對(duì)象抠璃。
innerHeight	返回窗口的文檔顯示區(qū)的高度。
innerWidth	返回窗口的文檔顯示區(qū)的寬度脱惰。
outerHeight	返回窗口的外部高度鸡典，包含工具條與滾動(dòng)條牌芋。
outerWidth	返回窗口的外部寬度顾瞪，包含工具條與滾動(dòng)條野蝇。
localStorage	在瀏覽器中存儲(chǔ) key/value 對(duì)。沒有過期時(shí)間舅踪。
location	用于窗口或框架的 Location 對(duì)象。請(qǐng)參閱 Location 對(duì)象良蛮。
name	設(shè)置或返回窗口的名稱抽碌。
navigator	對(duì) Navigator 對(duì)象的只讀引用。請(qǐng)參數(shù) Navigator 對(duì)象决瞳。
opener	返回對(duì)創(chuàng)建此窗口的窗口的引用货徙。
pageXOffset	設(shè)置或返回當(dāng)前頁(yè)面相對(duì)于窗口顯示區(qū)左上角的 X 位置。
pageYOffset	設(shè)置或返回當(dāng)前頁(yè)面相對(duì)于窗口顯示區(qū)左上角的 Y 位置皮胡。
screenX	返回相對(duì)于屏幕窗口的x坐標(biāo)
screenY	返回相對(duì)于屏幕窗口的y坐標(biāo)
parent	返回父窗口痴颊。
screen	對(duì) Screen 對(duì)象的只讀引用。請(qǐng)參數(shù) Screen 對(duì)象屡贺。
screenLeft	返回相對(duì)于屏幕窗口的x坐標(biāo)
screenTop	返回相對(duì)于屏幕窗口的y坐標(biāo)
sessionStorage	在瀏覽器中存儲(chǔ) key/value 對(duì)蠢棱。在關(guān)閉窗口或標(biāo)簽頁(yè)之后將會(huì)刪除這些數(shù)據(jù)。
self	返回對(duì)當(dāng)前窗口的引用甩栈。等價(jià)于 Window 屬性泻仙。
top	返回最頂層的父窗口。
status	設(shè)置窗口狀態(tài)欄的文本量没。

Window 對(duì)象方法

方法	描述
alert()	顯示帶有一段消息和一個(gè)確認(rèn)按鈕的警告框玉转。
atob()	解碼一個(gè) base-64 編碼的字符串。
btoa()	創(chuàng)建一個(gè) base-64 編碼的字符串殴蹄。
blur()	把鍵盤焦點(diǎn)從頂層窗口移開究抓。
setInterval()	按照指定的周期（以毫秒計(jì)）來調(diào)用函數(shù)或計(jì)算表達(dá)式。
setTimeout()	在指定的毫秒數(shù)后調(diào)用函數(shù)或計(jì)算表達(dá)式袭灯。
clearInterval()	取消由 setInterval() 設(shè)置的 timeout漩蟆。
clearTimeout()	取消由 setTimeout() 方法設(shè)置的 timeout。
close()	關(guān)閉瀏覽器窗口妓蛮。
confirm()	顯示帶有一段消息以及確認(rèn)按鈕和取消按鈕的對(duì)話框怠李。
createPopup()	創(chuàng)建一個(gè) pop-up 窗口。只有 IE 瀏覽器支持 createPopup() 方法，其他瀏覽器都不支持捺癞。
focus()	把鍵盤焦點(diǎn)給予一個(gè)窗口夷蚊。
getSelection()	返回一個(gè) Selection 對(duì)象，表示用戶選擇的文本范圍或光標(biāo)的當(dāng)前位置髓介。
getComputedStyle()	獲取指定元素的 CSS 樣式惕鼓。
matchMedia()	該方法用來檢查 media query 語(yǔ)句，它返回一個(gè) MediaQueryList對(duì)象唐础。
moveBy()	可相對(duì)窗口的當(dāng)前坐標(biāo)把它移動(dòng)指定的像素箱歧。
moveTo()	把窗口的左上角移動(dòng)到一個(gè)指定的坐標(biāo)。
open()	打開一個(gè)新的瀏覽器窗口或查找一個(gè)已命名的窗口一膨。
print()	打印當(dāng)前窗口的內(nèi)容呀邢。
prompt()	顯示可提示用戶輸入的對(duì)話框。
resizeBy()	按照指定的像素調(diào)整窗口的大小豹绪。
resizeTo()	把窗口的大小調(diào)整到指定的寬度和高度价淌。
scroll()	已廢棄。該方法已經(jīng)使用了 scrollTo()方法來替代瞒津。
scrollBy()	按照指定的像素值來滾動(dòng)內(nèi)容蝉衣。
scrollTo()	把內(nèi)容滾動(dòng)到指定的坐標(biāo)。
stop()	停止頁(yè)面載入巷蚪。

Window 對(duì)象屬性

closed

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鳥教程(runoob.com)</title>
<script>
var myWindow;
function openWin(){
    myWindow=window.open("","","width=400,height=200");
}
function closeWin(){
    if (myWindow){
        myWindow.close();
    }
}
function checkWin(){
    if (!myWindow){
        document.getElementById("msg").innerHTML="我的窗口沒有被打開!";
    }
    else{
        if (myWindow.closed){
            document.getElementById("msg").innerHTML="我的窗口被關(guān)閉!";
        }
        else{
            document.getElementById("msg").innerHTML="我的窗口沒有被關(guān)閉!";
        }
    }   
}
</script>
</head>
<body>

<input type="button" value="打開我的窗口" onclick="openWin()" />
<input type="button" value="關(guān)閉我的窗口" onclick="closeWin()" />
<br><br>
<input type="button" value="我的窗口被關(guān)閉了嗎?" onclick="checkWin()" />
<br><br>
<div id="msg"></div>

語(yǔ)法

window.closed

defaultStatus

<html>
<body>

<script>
  window.defaultStatus="這是默認(rèn)狀態(tài)欄文本! !";
</script>

</body>
</html>

defaultStatus 屬性可設(shè)置或返回窗口狀態(tài)欄中的默認(rèn)文本病毡。該屬性可讀可寫。

該文本會(huì)在頁(yè)面加載時(shí)被顯示屁柏。

語(yǔ)法

window.defaultStatus

瀏覽器支持

Safari

? 注意： defaultStatus屬性在IE剪验，火狐，Chrome前联，和Safari默認(rèn)配置是不能正常工作功戚。要允許腳本來改變狀態(tài)欄文本，用戶必須把配置屏幕首選項(xiàng)設(shè)置為false dom.disable_window_status_change似嗤。（或在Firefox："工具 - 選項(xiàng) - 內(nèi)容 - 啟用的JavaScript /"高級(jí)" - 允許腳本更改狀態(tài)欄文本"）啸臀。

frameslength

<!-- 在頁(yè)面中查找所有框架的數(shù)量，然后修改 iframe 元素的 src 屬性為 "https://www.runoob.com": -->

<button onclick="myFunction()">點(diǎn)我</button>
<br><br>

<iframe src="https://www.baidu.com"></iframe>
<iframe src="https://www.taobao.com"></iframe>
<iframe src="https://c.runoob.com"></iframe>

<script>
function myFunction() {
    var frames = window.frames;
    var i;

    for (i = 0; i < frames.length; i++) {
        frames[i].location = "https://www.runoob.com";
    }
}
</script>

frames 屬性返回窗口中所有命名的框架烁落。

該集合是 Window 對(duì)象的數(shù)組乘粒，每個(gè) Window 對(duì)象在窗口中含有一個(gè)框架或 <iframe>。屬性 frames.length 存放數(shù)組 frames[] 中含有的元素個(gè)數(shù)伤塌。注意灯萍，frames[] 數(shù)組中引用的框架可能還包括框架，它們自己也具有 frames[] 數(shù)組每聪。

? 提示：使用 frames.length 來獲取框架的數(shù)量旦棉。

? 注意:該屬性也可用于 <frame> 元素齿风，但是 HTML5 不支持 <frame> 元素。

該屬性是只讀的绑洛。

語(yǔ)法

window.frames

innerHeightinnerWidthouterHeightouterWidth

var w1=window.innerWidth;
var h1=window.innerHeight;
var w2=window.outerWidth;
var h2=window.outerHeight;
console.log("innerWidth: " + w1 + " innerHeight: " + h1 +"outerWidth: " + w2 + " outerHeight: " + h2)
// innerWidth: 1050 innerHeight: 969outerWidth: 1920 outerHeight: 1040

定義和用法

innerheight 返回窗口的文檔顯示區(qū)的高度救斑。

innerwidth 返回窗口的文檔顯示區(qū)的寬度。

outerHeight 屬性設(shè)置或返回一個(gè)窗口的外部高度真屯，包括所有界面元素（如工具欄/滾動(dòng)條）脸候。

outerWidth 屬性設(shè)置或返回窗口的外部寬度，包括所有的界面元素（如工具欄/滾動(dòng)）绑蔫。

? 注意：使用 innerWidth 和 innerHeight 屬性獲取去除工具條與滾動(dòng)條的窗口高度與寬度运沦。

? 注意：使用 outerWidth 和 outerHeight 屬性獲取加上工具條與滾動(dòng)條窗口的寬度與高度。

語(yǔ)法

Get:

window.innerWidth

window.innerHeight

window.outerWidth

window.outerHeight

Set:

window.innerWidth=pixels

window.innerHeight=pixels

window.outerWidth=pixels

window.outerHeight=pixels

name

myWindow=window.open('','MsgWindow','width=200,height=100');
myWindow.document.write("<p>窗口名稱為: " + myWindow.name + "</p>");
// 窗口名稱為: MsgWindow

定義和用法

name 屬性可設(shè)置或返回存放窗口的名稱的一個(gè)字符串配深。

語(yǔ)法

window.name

openr

myWindow=window.open('','hhh','width=200,height=100');
myWindow.document.write("<p>這是我的窗口</p>");          // 新窗口：這是我的窗口
myWindow.focus();
myWindow.opener.document.write("<p>這個(gè)是源窗口!</p>");  // 源窗口：這個(gè)是源窗口!

定義和用法

opener 屬性是一個(gè)可讀可寫的屬性携添，可返回對(duì)創(chuàng)建該窗口的 Window 對(duì)象的引用。

當(dāng)使用window.open()打開一個(gè)窗口凉馆，您可以使用此屬性返回來自目標(biāo)窗口源（父）窗口的詳細(xì)信息。

代碼提示： window.opener.close() 將關(guān)閉源（父）窗口亡资。

語(yǔ)法

window.opener

pagexoffsetpageyoffset

window.scrollBy(100, 100);
alert("pageXOffset: " + window.pageXOffset + ", pageYOffset: " + window.pageYOffset);
// pageXOffset: 100, pageYOffset: 100

定義和用法

pageXOffset 和 pageYOffset 屬性返回文檔在窗口左上角水平和垂直方向滾動(dòng)的像素澜共。

pageXOffset 設(shè)置或返回當(dāng)前頁(yè)面相對(duì)于窗口顯示區(qū)左上角的 X 位置。pageYOffset 設(shè)置或返回當(dāng)前頁(yè)面相對(duì)于窗口顯示區(qū)左上角的 Y 位置锥腻。

pageXOffset 和 pageYOffset 屬性相等于 scrollX 和 scrollY 屬性嗦董。

這些屬性是只讀的。

語(yǔ)法

window.pageXOffset

window.pageYOffset

screenxscreeny

myWindow=window.open('','');
myWindow.document.write("<p>This is 'myWindow'");
myWindow.document.write("<br>ScreenX: " + myWindow.screenX);
myWindow.document.write("<br>ScreenY: " + myWindow.screenY + "</p>");

定義和用法

screenX 和 screenY 屬性返回窗口相對(duì)于屏幕的X和Y坐標(biāo)瘦黑。

語(yǔ)法

window.screenX

window.screenY

瀏覽器支持
Internet ExplorerFirefoxOperaGoogle ChromeSafari

除了 Internet Explorer外京革，所有主要瀏覽器都支持screenX和screenY屬性。

? 注意： IE瀏覽器使用幸斥。 window.screenLeft 和 window.screenTop 獲得相同的值

parent

var newwin = window.open('','','width=200,height=100');
alert(window.parent.location);
// https://www.runoob.com/try/try.php?filename=tryjsref_win_parent

定義和用法

parent 屬性返回當(dāng)前窗口的父窗口匹摇。

語(yǔ)法

window.parent

screenleftscreentop

myWindow=window.open('','');
myWindow.document.write("<p>這是'我的窗口'");
myWindow.document.write("<br>ScreenLeft: " + myWindow.screenLeft);
myWindow.document.write("<br>ScreenTop: " + myWindow.screenTop + "</p>");
/*
這是'我的窗口'
ScreenLeft: 0
ScreenTop: 0
*/

定義和用法

screenLeft 和 screenTop 屬性返回窗口相對(duì)于屏幕的X和Y坐標(biāo)。

語(yǔ)法

window.screenLeft
window.screenTop

瀏覽器支持

所有主流瀏覽器都支持 screenLeft 和 screenTop 屬性甲葬，F(xiàn)irefox除外廊勃。

? 注意： Firefox 瀏覽器請(qǐng)使用 window.screenX and window.screenY。

selftop

<script>
function check(){
    if (window.top!=window.self) {
        document.write("<p>這個(gè)窗口不是最頂層窗口!我在一個(gè)框架?</p>")
    }
    else{ 
        document.write("<p>這個(gè)窗口是最頂層窗口!</p>")
    } 
}
</script>
    
<input type="button" onclick="check()" value="檢查窗口">

<!-- 這個(gè)窗口不是最頂層窗口!我在一個(gè)框架? -->

定義和用法

self 屬性返回指向當(dāng)前 window 對(duì)象的引用经窖，利用這個(gè)屬性坡垫，可以保證在多個(gè)窗口被打開的情況下，正確調(diào)用當(dāng)前窗口內(nèi)的函數(shù)或?qū)傩远粫?huì)發(fā)生混亂画侣。

self 屬性是只讀的冰悠。

top 屬性返回當(dāng)前窗口的最頂層瀏覽器窗口。

語(yǔ)法

window.self

window.top

? 注： window 配乱、 self 溉卓、 window.self 是等價(jià)的皮迟。

status

window.status="一些文本在狀態(tài)欄!";

定義和用法

status 屬性可設(shè)置或返回窗口狀態(tài)欄中的文本。

語(yǔ)法

window.status

瀏覽器支持

? 注意： status 屬性在IE的诵，火狐万栅，Chrome，和Safari默認(rèn)配置是不能正常工作西疤。要允許腳本來改變狀態(tài)欄文本烦粒，用戶必須把配置屏幕首選項(xiàng)設(shè)置為false dom.disable_window_status_change。（或在Firefox："工具 - 選項(xiàng) - 內(nèi)容 - 啟用的JavaScript /"高級(jí)" - 允許腳本更改狀態(tài)欄文本"）代赁。

Window對(duì)象方法

atobbtoa

var str = "RUNOOB";
var enc = window.btoa(str);  // 編碼字符串為: UlVOT09C
var dec = window.atob(enc);  // 解碼后字符串為: RUNOOB

定義和用法

atob() 方法用于解碼使用 base-64 編碼的字符串扰她。

btoa() 方法用于創(chuàng)建一個(gè) base-64 編碼的字符串。

該方法使用 "A-Z", "a-z", "0-9", "+", "/" 和 "=" 字符來編碼字符串芭碍。

語(yǔ)法

window.atob(encodedStr)

window.btoa(str)

setclear

<p>顯示當(dāng)前時(shí)間:</p>

<p id="demo"></p>

<button onclick="myStopFunction()">停止時(shí)間</button>

<script>
var myVar = setInterval(function(){ myTimer() }, 1000);

function myTimer() {
    var d = new Date();
    var t = d.toLocaleTimeString();
    document.getElementById("demo").innerHTML = t;
}

function myStopFunction() {
    clearInterval(myVar);
}
</script>

<body>

<p>點(diǎn)擊按鈕徒役，等待 3 秒后彈出 "Hello" 。</p>
<p>點(diǎn)擊第二個(gè)按鈕來阻止彈出函數(shù) myFunction 的執(zhí)行窖壕。 (你必須在 3 秒前點(diǎn)擊)</p>

<button onclick="myFunction()">先點(diǎn)我</button>
<button onclick="myStopFunction()">阻止彈出</button>

<script>
var myVar;

function myFunction() {
    myVar = setTimeout(function(){ alert("Hello") }, 3000);
}

function myStopFunction() {
    clearTimeout(myVar);
}
</script>

</body>

定義和用法

①

setInterval() 方法可按照指定的周期（以毫秒計(jì)）來調(diào)用函數(shù)或計(jì)算表達(dá)式忧勿。

setInterval() 方法會(huì)不停地調(diào)用函數(shù)，直到 clearInterval() 被調(diào)用或窗口被關(guān)閉瞻讽。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的參數(shù)鸳吸。

? 提示： 1000 毫秒= 1 秒。

? 提示：如果你只想執(zhí)行一次可以使用 setTimeout() 方法速勇。

②

clearInterval() 方法可取消由 setInterval() 函數(shù)設(shè)定的定時(shí)執(zhí)行操作晌砾。

clearInterval() 方法的參數(shù)必須是由 setInterval() 返回的 ID 值。

注意: 要使用 clearInterval() 方法, 在創(chuàng)建執(zhí)行定時(shí)操作時(shí)要使用全局變量：

myVar = setInterval("javascript 函數(shù)", milliseconds);

可以通過 clearInterval(myVar) 方法來停止執(zhí)行烦磁。

③

setTimeout() 方法用于在指定的毫秒數(shù)后調(diào)用函數(shù)或計(jì)算表達(dá)式养匈。

? 提示： 1000 毫秒= 1 秒。

? 提示：如果你只想重復(fù)執(zhí)行可以使用 setInterval() 方法都伪。

? 提示：使用 clearTimeout() 方法來阻止函數(shù)的執(zhí)行呕乎。

④

clearTimeout() 方法可取消由 setTimeout() 方法設(shè)置的定時(shí)操作。

clearTimeout() 方法的參數(shù)必須是由 setTimeout() 返回的 ID 值陨晶。

? 注意: 要使用 clearTimeout() 方法, 在創(chuàng)建執(zhí)行定時(shí)操作時(shí)要使用全局變量：

myVar = setTimeout("javascript function", milliseconds);

語(yǔ)法

①

setInterval(code, milliseconds);

setInterval(function, milliseconds, param1, param2, ...)

參數(shù)	描述
code/function	必需楣嘁。要調(diào)用一個(gè)代碼串，也可以是一個(gè)函數(shù)珍逸。
milliseconds	必須逐虚。周期性執(zhí)行或調(diào)用 code/function 之間的時(shí)間間隔，以毫秒計(jì)谆膳。
param1, param2, ...	可選叭爱。傳給執(zhí)行函數(shù)的其他參數(shù)（IE9 及其更早版本不支持該參數(shù)）。

②

clearInterval(id_of_setinterval)

參數(shù)	描述
id_of_setinterval	調(diào)用 setInterval() 函數(shù)時(shí)所獲得的返回值漱病，使用該返回標(biāo)識(shí)符作為參數(shù)买雾，可以取消該 setInterval() 所設(shè)定的定時(shí)執(zhí)行操作把曼。

③

setTimeout(code, milliseconds, param1, param2, ...)

setTimeout(function, milliseconds, param1, param2, ...)

參數(shù)	描述
code/function	必需。要調(diào)用一個(gè)代碼串漓穿，也可以是一個(gè)函數(shù)嗤军。
milliseconds	可選。執(zhí)行或調(diào)用 code/function 需要等待的時(shí)間晃危，以毫秒計(jì)叙赚。默認(rèn)為 0。
param1, param2, ...	可選僚饭。傳給執(zhí)行函數(shù)的其他參數(shù)（IE9 及其更早版本不支持該參數(shù)）震叮。

④

clearTimeout(id_of_settimeout)

參數(shù)	描述
id_of_setinterval	調(diào)用 setTimeout() 函數(shù)時(shí)所獲得的返回值，使用該返回標(biāo)識(shí)符作為參數(shù)鳍鸵，可以取消該 setTimeout() 所設(shè)定的定時(shí)執(zhí)行操作苇瓣。

close

<script>
function openWin(){
    myWindow=window.open("","","width=200,height=100");
    myWindow.document.write("<p>這是'我的窗口'</p>");
}
function closeWin(){
    myWindow.close();
}
</script>
</head>
<body>

<input type="button" value="打開我的窗口" onclick="openWin()" />
<input type="button" value="關(guān)閉我的窗口" onclick="closeWin()" />

</body>

confirm

<body>

<p>點(diǎn)擊按鈕，顯示確認(rèn)框偿乖。</p>
<button onclick="myFunction()">點(diǎn)我</button>
<p id="demo"></p>
<script>
function myFunction(){
    var x;
    var r=confirm("按下按鈕!");
    if (r==true){
        x="你按下了\"確定\"按鈕!";
    }
    else{
        x="你按下了\"取消\"按鈕!";
    }
    document.getElementById("demo").innerHTML=x;
}
</script>

</body>

定義和用法

confirm() 方法用于顯示一個(gè)帶有指定消息和確認(rèn)及取消按鈕的對(duì)話框击罪。

如果訪問者點(diǎn)擊"確定"，此方法返回true贪薪，否則返回false媳禁。

語(yǔ)法

confirm(message)

focus

<script>
function openWin(){
    myWindow=window.open('','','width=200,height=100');
    myWindow.document.write("<p>這是'我的窗口'</p>");
    myWindow.focus();
}
</script>
<body>

<input type="button" value="打開窗口" onclick="openWin()" />

</body>

定義和用法

focus() 方法可把鍵盤焦點(diǎn)給予一個(gè)窗口。

語(yǔ)法

window.focus()

getcomputedstyle

<p>點(diǎn)擊按鈕計(jì)算 DIV 的背景顏色古掏。</p>
<p><button onclick="myFunction()">點(diǎn)我</button></p>
<div id="test" style="height: 50px;background-color: rgb(178, 116, 230);">測(cè)試 DIV</div>
<p>計(jì)算值為: <span id="demo"></span></p>

<script>
function myFunction(){
    var elem = document.getElementById("test");
    var theCSSprop = window.getComputedStyle(elem, null).getPropertyValue("background-color");
    document.getElementById("demo").innerHTML = theCSSprop;
}

定義和用法

getComputedStyle() 方法用于獲取指定元素的 CSS 樣式损话。

獲取的樣式是元素在瀏覽器中最終渲染效果的樣式侦啸。

語(yǔ)法

window.getComputedStyle(element, pseudoElement)

參數(shù)	說明
element	必需槽唾，要獲取樣式的元素。
pseudoElement	可選光涂，偽類元素庞萍，當(dāng)不查詢偽類元素的時(shí)候可以忽略或者傳入 null。

返回值

返回的對(duì)象是 CSSStyleDeclaration 類型的對(duì)象忘闻。

matchmedia

<p>判斷屏幕（screen/viewport）窗口大小钝计。</p>

<button onclick="myFunction()">點(diǎn)我</button>

<p id="demo"></p>

<script>
function myFunction() {
    var x = document.getElementById("demo");
    if (window.matchMedia("(max-width: 700px)").matches) {
        x.innerHTML = "窗口小于或等于 700 像素";
    } else {
        x.innerHTML = "窗口大于 700 像素";
    }
}
</script>

定義和用法

matchMedia() 返回一個(gè)新的 MediaQueryList 對(duì)象，表示指定的媒體查詢字符串解析后的結(jié)果齐佳。

matchMedia() 方法的值可以是任何一個(gè) CSS @media 規(guī)則的特性, 如 min-height, min-width, orientation 等私恬。

MediaQueryList 對(duì)象有以下兩個(gè)屬性：

media：查詢語(yǔ)句的內(nèi)容。

matches：用于檢測(cè)查詢結(jié)果炼吴，如果文檔匹配 media query 列表本鸣，值為 true，否則為 false硅蹦。
MediaQueryList 對(duì)象還可以監(jiān)聽事件荣德。通過監(jiān)聽闷煤，在查詢結(jié)果發(fā)生變化時(shí)，就調(diào)用指定的回調(diào)函數(shù)涮瞻。

方法	描述
addListener(functionref)	添加一個(gè)新的監(jiān)聽器函數(shù)鲤拿，該函數(shù)在媒體查詢的結(jié)果發(fā)生變化時(shí)執(zhí)行。
removeListener(functionref)	從媒體查詢列表中刪除之前添加的監(jiān)聽器署咽。如果指定的監(jiān)聽器不在列表中近顷，則不執(zhí)行任何操作。

語(yǔ)法

window.matchMedia(mediaQueryString)

參數(shù)	說明
mediaQueryString	必需艇抠，一個(gè)字符串幕庐，表示即將返回一個(gè)新 MediaQueryList 對(duì)象的媒體查詢。

返回值

返回 MediaQueryList 對(duì)象家淤。

movebymoveto

<script>
function openWin(){
    myWindow=window.open('','我的窗口','width=200,height=100');
    myWindow.document.write("<p>這是我的窗口</p>");
}
function movebyWin(){
    myWindow.moveBy(250,250);    // 相對(duì)移動(dòng)
    myWindow.focus();
}
function movetoWin(){
    myWindow.moveTo(100,100);    // 移到指定位置
    myWindow.focus();
}
</script>

<body>

<input type="button" value="打開我的窗口" onclick="openWin()" />
<br><br>
<input type="button" value="移動(dòng)我的窗口" onclick="movebyWin()" />
<input type="button" value="移動(dòng)我的窗口" onclick="movetoWin()" />

</body>

定義和用法

moveBy() 方法可相對(duì)窗口的當(dāng)前坐標(biāo)把它移動(dòng)指定的像素异剥。

moveTo() 方法可把窗口的左上角移動(dòng)到一個(gè)指定的坐標(biāo)。

語(yǔ)法

window.moveBy(x,y)

window.moveTo(x,y)

open

myWindow=window.open('','MsgWindow','width=200,height=100');
myWindow.document.write("<p>窗口名稱為: " + myWindow.name + "</p>");
// 窗口名稱為: MsgWindow

定義和用法

open() 方法用于打開一個(gè)新的瀏覽器窗口或查找一個(gè)已命名的窗口絮重。

語(yǔ)法

window.open(URL,name,specs,replace)

參數(shù)	說明
URL	可選冤寿。打開指定的頁(yè)面的URL。如果沒有指定URL青伤，打開一個(gè)新的空白窗口
name	可選督怜。指定target屬性或窗口的名稱。支持以下值：
	* _blank - URL加載到一個(gè)新的窗口狠角。這是默認(rèn)
	* _parent - URL加載到父框架
	* _self - URL替換當(dāng)前頁(yè)面
	* _top - URL替換任何可加載的框架集
	* name - 窗口名稱
specs	可選号杠。一個(gè)逗號(hào)分隔的項(xiàng)目列表。支持以下值：
	channelmode=yes	是否要在影院模式顯示 window丰歌。默認(rèn)是沒有的姨蟋。僅限IE瀏覽器
	directories=yes	是否添加目錄按鈕。默認(rèn)是肯定的立帖。僅限IE瀏覽器
	fullscreen=yes	瀏覽器是否顯示全屏模式眼溶。默認(rèn)是沒有的。在全屏模式下的 window晓勇，還必須在影院模式堂飞。僅限IE瀏覽器
	height=pixels	窗口的高度。最小.值為100
	left=pixels	該窗口的左側(cè)位置
	location=yes	是否顯示地址字段.默認(rèn)值是yes
	menubar=yes	是否顯示菜單欄.默認(rèn)值是yes
	resizable=yes	是否可調(diào)整窗口大小.默認(rèn)值是yes
	scrollbars=yes	是否顯示滾動(dòng)條.默認(rèn)值是yes
	status=yes	是否要添加一個(gè)狀態(tài)欄.默認(rèn)值是yes
	titlebar=yes	是否顯示標(biāo)題欄.被忽略绑咱，除非調(diào)用HTML應(yīng)用程序或一個(gè)值得信賴的對(duì)話框.默認(rèn)值是yes
	toolbar=yes	是否顯示瀏覽器工具欄.默認(rèn)值是yes
	top=pixels	窗口頂部的位置.僅限IE瀏覽器
	width=pixels	窗口的寬度.最小.值為100
replace	Optional.Specifies規(guī)定了裝載到窗口的 URL 是在窗口的瀏覽歷史中創(chuàng)建一個(gè)新條目绰筛，還是替換瀏覽歷史中的當(dāng)前條目。支持下面的值：
	* true - URL 替換瀏覽歷史中的當(dāng)前條目描融。
	* false - URL 在瀏覽歷史中創(chuàng)建新的條目铝噩。

print

// 打印當(dāng)前頁(yè)：
function printpage(){
    window.print();
}

定義和用法

print() 方法用于打印當(dāng)前窗口的內(nèi)容。

語(yǔ)法

window.print()

prompt

<body>

<p>點(diǎn)擊按鈕查看輸入的對(duì)話框稼稿。</p>
<button onclick="myFunction()">點(diǎn)我</button>
<p id="demo"></p>
<script>
function myFunction(){
    var x;
    var person=prompt("請(qǐng)輸入你的名字","Harry Potter");
    if (person!=null && person!=""){
        x="你好 " + person + "! 今天感覺如何?";
        document.getElementById("demo").innerHTML=x;
    }
}
</script>

</body>

定義和用法

prompt() 方法用于顯示可提示用戶進(jìn)行輸入的對(duì)話框薄榛。

這個(gè)方法返回用戶輸入的字符串讳窟。

語(yǔ)法

prompt(msg,defaultText)

參數(shù)	描述
msg	可選。要在對(duì)話框中顯示的純文本（而不是 HTML 格式的文本）敞恋。
defaultText	可選丽啡。默認(rèn)的輸入文本。

resizebyto

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鳥教程(runoob.com)</title>
<script>
var w;
function openwindow(){
    w=window.open('','', 'width=100,height=100');
    w.focus();
}
function resizeWindow(){
    w.top.resizeBy(100,100);
}
function myFunction(){
    w.resizeTo(500,500);
    w.focus();
}
    
</script>
</head>
<body>

<button onclick="openwindow()">創(chuàng)建窗口</button>
<button onclick="resizeWindow()">調(diào)整窗口</button>
<button onclick="myFunction()">調(diào)整窗口</button>

</body>
</html>

定義和用法

resizeBy() 方法用于根據(jù)指定的像素來調(diào)整窗口的大小硬猫。

? 注意：此方法定義指定窗口的右下角角落移動(dòng)的像素补箍，左上角將不會(huì)被移動(dòng)(它停留在其原來的坐標(biāo)).

resizeTo 方法用于把窗口大小調(diào)整為指定的寬度和高度。

語(yǔ)法

resizeBy(width,height)

參數(shù)	描述
width	必需啸蜜。要使窗口寬度增加的像素?cái)?shù)坑雅。可以是正衬横、負(fù)數(shù)值裹粤。
height	可選。要使窗口高度增加的像素?cái)?shù)蜂林∫Ｋ撸可以是正、負(fù)數(shù)值噪叙。

window.resizeTo(width,height)

參數(shù)	說明
width	必需的矮锈。設(shè)置窗口的寬度，以像素為單位
height	必需的睁蕾。設(shè)置窗口的高度苞笨，以像素為單位

瀏覽器支持

所有主要瀏覽器都支持 resizeBy() 方法，除了Opera和Chrome子眶。

所有主要瀏覽器都支持 resizeTo() 方法

從 Firefox 7 開始瀑凝，不能改變?yōu)g覽器窗口的大小了，要依據(jù)下面的規(guī)則：

不能設(shè)置那些不是通過 window.open 創(chuàng)建的窗口或 Tab 的大小壹店。

當(dāng)一個(gè)窗口里面含有一個(gè)以上的 Tab 時(shí)猜丹，無法設(shè)置窗口的大小芝加。

scrollbyto

<script>
function scrollByWindow(){
    window.scrollBy(100,100);
}
function scrollToWindow(){
    window.scrollTo(100,100);
}
</script>

<body>
<input type="button" onclick="scrollByWindow()" value="滾動(dòng)條" />
<input type="button" onclick="scrollToWindow()" value="滾動(dòng)條" />

<p>滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) </p>
<br><br><br><br><br><br><br><br>
<p>滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) </p>
<br><br><br><br><br><br><br><br>
<p>滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) </p>
<br><br><br><br><br><br><br><br>
<p>滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) </p>
<br><br><br><br><br><br><br><br>
<p>滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) </p>
<br><br><br><br><br><br><br><br>
<p>滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) </p>
<br><br><br><br><br><br><br><br>
<p>滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) </p>
<br><br><br><br><br><br><br><br>
<p>滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) 滾動(dòng) </p>
<br><br><br><br><br><br><br><br>

</body>

定義和用法

scrollBy() 方法可把內(nèi)容滾動(dòng)指定的像素?cái)?shù)硅卢。

scrollTo() 方法可把內(nèi)容滾動(dòng)到指定的坐標(biāo)。

? 注意：要使此方法工作 window 滾動(dòng)條的可見屬性必須設(shè)置為true藏杖！

語(yǔ)法

scrollBy(xnum,ynum)

參數(shù)	描述
xnum	必需将塑。把文檔向右滾動(dòng)的像素?cái)?shù)。
ynum	必需蝌麸。把文檔向下滾動(dòng)的像素?cái)?shù)点寥。

scrollTo(xpos,ypos)

參數(shù)	描述
xpos	必需。要在窗口文檔顯示區(qū)左上角顯示的文檔的 x 坐標(biāo)来吩。
ypos	必需敢辩。要在窗口文檔顯示區(qū)左上角顯示的文檔的 y 坐標(biāo)蔽莱。

stop

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>菜鳥教程(runoob.com)</title>
    <script>
        window.stop();
    </script>
</head>
<body>

<p>stop() 方法阻止了 iframe 頁(yè)面的載入。</p>
<p><b>注意:</b> Internet Explorer 瀏覽器不支持該方法戚长。</p>

<iframe src="https://www.runoob.com"></iframe>

</body>
</html>

定義和用法

stop() 方法用于停止頁(yè)面載入盗冷。

該方法類似在瀏覽器上點(diǎn)擊停止載入按鈕。

如果頁(yè)面在載入圖片或框架(iframe)時(shí)間過長(zhǎng)同廉，我門可以使用該方法來停止載入仪糖。

沒有返回值。

語(yǔ)法

window.stop()

最后編輯于：2019.08.17 15:21:30

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者

人面猴
序言：七十年代末迫肖，一起剝皮案震驚了整個(gè)濱河市锅劝，隨后出現(xiàn)的幾起案子，更是在濱河造成了極大的恐慌蟆湖，老刑警劉巖故爵，帶你破解...
沈念sama閱讀 210,914評(píng)論 6贊 490
死咒
序言：濱河連續(xù)發(fā)生了三起死亡事件，死亡現(xiàn)場(chǎng)離奇詭異隅津，居然都是意外死亡稠集，警方通過查閱死者的電腦和手機(jī)，發(fā)現(xiàn)死者居然都...
沈念sama閱讀 89,935評(píng)論 2贊 383
救了他兩次的神仙讓他今天三更去死
文/潘曉璐我一進(jìn)店門饥瓷，熙熙樓的掌柜王于貴愁眉苦臉地迎上來剥纷，“玉大人，你說我怎么就攤上這事呢铆』扌” “怎么了？”我有些...
開封第一講書人閱讀 156,531評(píng)論 0贊 345
道士緝兇錄：失蹤的賣姜人
文/不壞的土叔我叫張陵棺克，是天一觀的道長(zhǎng)悠垛。經(jīng)常有香客問我，道長(zhǎng)娜谊，這世上最難降的妖魔是什么确买？我笑而不...
開封第一講書人閱讀 56,309評(píng)論 1贊 282
?港島之戀（遺憾婚禮）
正文為了忘掉前任，我火速辦了婚禮纱皆，結(jié)果婚禮上湾趾，老公的妹妹穿的比我還像新娘。我一直安慰自己派草，他們只是感情好搀缠，可當(dāng)我...
茶點(diǎn)故事閱讀 65,381評(píng)論 5贊 384
惡毒庶女頂嫁案：這布局不是一般人想出來的
文/花漫我一把揭開白布。她就那樣靜靜地躺著近迁，像睡著了一般艺普。火紅的嫁衣襯著肌膚如雪。梳的紋絲不亂的頭發(fā)上，一...
開封第一講書人閱讀 49,730評(píng)論 1贊 289
城市分裂傳說
那天歧譬，我揣著相機(jī)與錄音岸浑，去河邊找鬼。笑死瑰步，一個(gè)胖子當(dāng)著我的面吹牛助琐，可吹牛的內(nèi)容都是我干的。我是一名探鬼主播面氓，決...
沈念sama閱讀 38,882評(píng)論 3贊 404
雙鴛鴦連環(huán)套：你想象不到人心有多黑
文/蒼蘭香墨我猛地睜開眼兵钮，長(zhǎng)吁一口氣：“原來是場(chǎng)噩夢(mèng)啊……” “哼！你這毒婦竟也來了舌界？” 一聲冷哼從身側(cè)響起掘譬，我...
開封第一講書人閱讀 37,643評(píng)論 0贊 266
萬(wàn)榮殺人案實(shí)錄
序言：老撾萬(wàn)榮一對(duì)情侶失蹤，失蹤者是張志新（化名）和其女友劉穎呻拌，沒想到半個(gè)月后葱轩，有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體，經(jīng)...
沈念sama閱讀 44,095評(píng)論 1贊 303
?護(hù)林員之死
正文獨(dú)居荒郊野嶺守林人離奇死亡藐握，尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛以下內(nèi)容為張勛視角年9月15日...
茶點(diǎn)故事閱讀 36,448評(píng)論 2贊 325
?白月光啟示錄
正文我和宋清朗相戀三年靴拱，在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片猾普。...
茶點(diǎn)故事閱讀 38,566評(píng)論 1贊 339
活死人
序言：一個(gè)原本活蹦亂跳的男人離奇死亡袜炕，死狀恐怖，靈堂內(nèi)的尸體忽然破棺而出初家，到底是詐尸還是另有隱情偎窘，我是刑警寧澤，帶...
沈念sama閱讀 34,253評(píng)論 4贊 328
?日本核電站爆炸內(nèi)幕
正文年R本政府宣布溜在，位于F島的核電站陌知，受9級(jí)特大地震影響，放射性物質(zhì)發(fā)生泄漏掖肋。R本人自食惡果不足惜仆葡，卻給世界環(huán)境...
茶點(diǎn)故事閱讀 39,829評(píng)論 3贊 312
男人毒藥：我在死后第九天來索命
文/蒙蒙一、第九天我趴在偏房一處隱蔽的房頂上張望志笼。院中可真熱鬧沿盅，春花似錦、人聲如沸籽腕。這莊子的主人今日做“春日...
開封第一講書人閱讀 30,715評(píng)論 0贊 21
一樁弒父案纸俭，背后竟有這般陰謀
文/蒼蘭香墨我抬頭看了看天上的太陽(yáng)皇耗。三九已至，卻和暖如春揍很，著一層夾襖步出監(jiān)牢的瞬間郎楼，已是汗流浹背万伤。一陣腳步聲響...
開封第一講書人閱讀 31,945評(píng)論 1贊 264
情欲美人皮
我被黑心中介騙來泰國(guó)打工，沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留呜袁，地道東北人敌买。一個(gè)月前我還...
沈念sama閱讀 46,248評(píng)論 2贊 360
代替公主和親
正文我出身青樓，卻偏偏與公主長(zhǎng)得像阶界，于是被迫代替她去往敵國(guó)和親虹钮。傳聞我的和親對(duì)象是個(gè)殘疾皇子，可洞房花燭夜當(dāng)晚...
茶點(diǎn)故事閱讀 43,440評(píng)論 2贊 348

Window對(duì)象

Window對(duì)象

CONTENT

Window 對(duì)象屬性

Window 對(duì)象方法

Window 對(duì)象屬性

closed

defaultStatus

frameslength

innerHeightinnerWidthouterHeightouterWidth

name

openr

pagexoffsetpageyoffset

screenxscreeny

parent

screenleftscreentop

selftop

status

Window對(duì)象方法

atobbtoa

setclear

close

confirm

focus

getcomputedstyle

matchmedia

movebymoveto

open

print

prompt

resizebyto

scrollbyto

stop

推薦閱讀更多精彩內(nèi)容