有時候，我們想通過JS實現一個<a>的新開標簽的效果，此時我們想到了window.open方法實現。那么window.open到底應該怎么使用呢？
我們知道window.open可以新開窗口或標簽頁（這通常和瀏覽器的設置選項有關），載入指定的URL到新的或已存在的窗口中，並返回代表那個窗口的window對象。window.close可以關閉窗口，但是只能自動關閉JS打開的窗口，如果要關閉其他窗口，必須提示用戶進行確定或取消操作（這個與瀏覽器相關，經測IE需要提示才能關閉；其他瀏覽器不允許自動關閉）。
我們可以直接使用window.open()打開窗口，使用window.close()關閉窗口
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>window.open和window.close的使用詳解</title>
</head>
<body>
<button id="openWindow">打開窗口</button>
<button id="closeWindow">關閉窗口</button>
<script>
(function(){
var $ = function(id) {return document.getElementById(id);}
var win = null;
//打開窗口
$('openWindow').onclick = function() {
win = window.open();
}
//關閉窗口
$('closeWindow').onclick = function() {
win && win.close();
}
//自動關閉窗口
window.close();
})();
</script>
</body>
</html>
window.open(URL, name[, property][, boolean])需要四個參數：
第一個參數URL：新窗口中顯示的文檔的URL，如果省略了或者為空時，會使用'about:blank'
第二個參數name：新窗口的名字，可以配合target使用，如果省略了，會使用‘_blank’（這里需要簡單介紹一下：_parent和_top，_parent指的是直接父級窗口，_top指的是頂級祖先窗口）
第三個參數protery：以逗號分割的可選參數，包含窗口大小和各種屬性。如果省略了，那么會用默認的大小和標准的UI組件（顯式的調用更像是打開窗口，而不是標簽）。這個參數是非標准的，HTML5規范也主張瀏覽器忽略它。
第四個參數boolean：只有在第二個參數命名的是存在的窗口，才有效。聲明了由第一個參數指定的URL，替換窗口瀏覽歷史的當前條目。
window.opener指的是原始窗口，如果沒有的話，為null。
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>window.open和window.close的使用詳解</title>
</head>
<body>
<button id="openWindow">打開窗口</button>
<button id="closeWindow">關閉窗口</button>
<script>
(function(){
var $ = function(id) {return document.getElementById(id);}
var win = null;
//打開窗口
$('openWindow').onclick = function() {
win = window.open('about:blank', '_blank', 'width=200,height=200');
//win.opener指的是新窗口原始窗口
//alert(win.opener === window);
}
//關閉窗口
$('closeWindow').onclick = function() {
win && win.close();
//主動關閉窗口后win.opener為false
//alert(win.opener === window);
}
//alert(window.opener === window);
//自動關閉窗口
//window.close();
})();
</script>
</body>
</html>