浏览器打开新标签页

缺乏、安全感 2022-05-22 09:35 554阅读 0赞

## html 实现 ##

`<a>`标签设置 `target="_blank"` 实现打开新标签的效果。

## JavaScript 实现 ##

[window.open()][window.open] ：打开一个新的浏览器窗口或查找一个已命名的窗口。

// window.open() 本来是打开新窗口用的，但没有指定第三个属性（即新窗口的特征）时，只会在当前窗口打开新的标签。
    window.open(URL, name, specs, replace);

*  URL，可选。打开指定的页面的URL。如果没有指定URL，打开与新的空白窗口
 *  name，可选。指定target属性或窗口的名称。支持以下值：  
    \_blank - URL加载到一个新的窗口。这是默认  
    \_parent - URL加载到父框架  
    \_self - URL替换当前页面  
    \_top - URL替换任何可加载的框架集  
    name - 窗口名称
 *  specs，可选。一个逗号分隔的项目列表（值参考 [API][window.open]）。
 *  replace，Optional.Specifies规定了装载到窗口的 URL 是在窗口的浏览历史中创建一个新条目，还是替换浏览历史中的当前条目。支持下面的值：  
    true - URL 替换浏览历史中的当前条目。  
    false - URL 在浏览历史中创建新的条目。

传言

> IE 中，如果要打开的URL与当前页面URL不属于同一个主域名则打开新窗口。 – 待验证  
> Chrome 中，若window.open()函数不是被鼠标键盘事件调用的，而是页面直接调用或通过定时器等调用的，则打开新窗口而非标签页。 – 验证并不会打开新的窗口，还是打开新的标签页

### 例子一：在新的浏览器中打开一个 window 空白页： ###

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

### 例子二：打开一个新窗口，并控制其外观 ###

function open_win() { 
    window.open("http://www.W3Cschool.com","_blank","toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=1000, height=800");
    }

[window.open]: https://www.w3cschool.cn/jsref/met-win-open.html