慎用target="_blank"

網頁裏的a標籤默認在當前窗口跳轉連接地址，若是須要在新窗口打開，須要給 a 標籤添加一個target="_blank"屬性。 例：

<a target="_blank" href="https://weibo.com/">打開微博頁面</a>
複製代碼

1 安全隱患

若是隻是加上target="_blank"，打開新窗口後，新頁面能經過window.opener獲取到來源頁面的window對象，即便跨域也同樣。

某些屬性的訪問被攔截，是由於跨域安全策略的限制。 可是，好比修改window.opener.location的值，指向另一個地址。

便可以形成剛剛仍是在某個網站瀏覽，隨後打開了新窗口，結果這個新窗口神不知鬼不覺地把原來的網頁地址改了。此時，就能夠經過頁面假裝，好比假裝成登錄頁等，來讓用戶輸入帳號密碼，從而到達黑客的目的。

2 性能問題

經過target="_blank"打開的新窗口，跟原來的頁面窗口共用一個進程。若是這個新頁面執行了一大堆性能很差的 JavaScript 代碼，佔用了大量系統資源，那你原來的頁面的性能也會收到影響。

3 解決方案

1. 儘可能不使用target="_blank"；
2. 若是必定要用，須要加上rel="noopener"或者rel="noreferrer"。這樣新窗口的window.openner就是null了，並且會讓新窗口運行在獨立的進程裏，不會拖累原來頁面的進程。(不過，有些瀏覽器對性能作了優化，即便不加這個屬性，新窗口也會在獨立進程打開。不過爲了安全考慮，仍是加上吧。)

3. 經過window.open的方式打開的新頁面:

var newWindow = window.open();
newWindow.opener = null;
newWindow.location = "https://weibo.com/";
newWindow.target = "_blank";
複製代碼