JavaScript Window物件與使用者互動
阿新 • • 發佈：2018-10-31
前言：Window物件是開啟瀏覽器視窗，可以控制視窗的大小和位置、視窗彈出框、開啟和關閉視窗。控制視窗顯示位址列，工具欄。還可以控制是否過載網頁、返回上一個或下一個文件。
1、警告對話方塊
window.alert(str);
程式碼片段：
<html> <body> <script type="text/javascript"> function win(){ window.alert("你好，我是一個警告框！"); } win(); </script> </body> </html>
結果顯示：
2、視窗開啟和關閉
window.open(url, "","");
程式碼片段：
<html> <body> <script type="text/javascript"> function win(){ window.open("https://blog.csdn.net/Rison_Li","",""); } win(); </script> </body> </html>
顯示結果：
開啟一個new視窗：
window.open("https://blog.csdn.net/Rison_Li","new");
開啟一個指定大小的視窗：
window.open("https://blog.csdn.net/Rison_Li","new","height = 100, width = 200");
開啟一個帶滾動條的視窗：
window.open("https://blog.csdn.net/Rison_Li","new","scrollbars,resizable");
關閉當前視窗：window.close();
3、詢問回答框
window.confirm(str);
程式碼片段：
<html>
<body>
<script type="text/javascript">
function win(){
var test = window.confirm("是否要關閉瀏覽器？");
if(test == true) window.close();
}
win();
</script>
</body>
</html>顯示結果：
4、視窗滾動
window.scrolly(x,y);
程式碼片段：
<script type="text/javascript">
var x = 0;
function win(){
x++;
window.scroll(0,x);
clearTimeout(t);
var t = setTimeout("win()",10);
}
win();
</script>顯示結果：
5、訪問視窗歷史
程式碼片段：
<a href = "javascript:window.history.go(-1);">後退</a>
<a href = "javascript:window.history.back(2);">前進</a>
<a href = "javascript:window.history.go(window.historylength-1);">末尾</a>
6、視窗事件
程式碼片段：
<html>
<body onfocus="a1();" onblur="a2();">
<script language="javascript">
function a1(){
document.write("視窗獲得焦點");
}
function a2(){
document.write("視窗失去焦點");
}
</script>
</body>
</html>顯示結果：
其他事件:
onload:文件載入時響應
onunload:文件未載入時響應
onresize:使用者改變視窗大小響應
onerror:javascript錯誤時，觸發錯誤處理事件
7、自動調整解析度
程式碼片段：
<html>
<body onload="size();">
<script language="javascript">
function size(){
window.resizeTo(screen.width - 100,screen.height - 100);
}
</script>
</body>
</html>希望對你有幫助，學會window物件對視窗進行一些簡單的控制。