如何设置新的浏览器标签的标题？ [英] How to set the title for the new browser tab?

问题描述

我有关于链接的新标签页的问题。

还有，我可以在用户点击链接之前设置浏览器标签标题吗？如果新标签中包含的html没有标题属性，似乎没有办法争论新标签的标题。我对吗？如何设置标题？

  // href是动态的，所以我不能一一设置它们，因为我有这里有100+个html文件
< a href =test.htmltarget =_ blank>打开我< a> 
  

解决方案

链接只是普通的HTML链接。当新页面在新标签页中打开时，当前页面不会有任何引用，因此不能以任何方式更改它。您需要使用javascript打开网页并设置标题。

您可以在中动态设置此窗口onload 找到所有 a 标签并添加点击事件打开窗口并设置标题。 p>

如果您想为每个页面使用不同的标题，可以将其存储在<$ c $中的 data - c> a 标签。

请注意，这仅适用于同一网域中的网页（为了安全），处理人们右键单击并按在新窗口中打开。

 > < a href =test.htmldata-title =A new pagetarget =_ blank>打开我< / a> 
  

JavaScript

  window.addEventListener（load，function（）{
 
 //实际打开
函数openWindow（event）{
 event = event || window.event; 
 
 //找到要设置的url和标题
 var href = this.getAttribute（href）; 
 var newTitle = this.getAttribute（data-title）; 
 //或者如果你使用其他方式工作标题... 
 // var newTitle =一些常量字符串; 
 
 //打开窗口
 var newWin = window.open（href，_blank）; 
 
 //向窗口添加一个载入监听器，页面加载
 newWin.addEventListener（load，function（）{
 newWin.document.title = newTitle; 
}）; 
 
 //停止默认`a`链接或者你将得到两个新窗口
 event.returnValue = false; 
} 
 
 //查找在新窗口中打开的所有标签
 var links = document.querySelectorAll（a [target = _blank] [data-title]）; 
 //或如果你不想存储每个链接的自定义标题这是
 // var links = document.querySelectorAll（a [target = _blank]）; 
 
 //为每个添加一个点击事件，以便我们可以做自己的事情
 for（var i = 0; i< links.length; i ++）{
 links [ i] .addEventListener（click，openWindow.bind（links [i]））; 
} 
 
}）; 
  

Sample JsFiddle

I have a question about the new tab for the link.

Is there anyway I can set the browser tab title before user clicks a link? It seems like there is no way to debate the title for the new tab if the html contained in the new tab doesn't have title attribute. Am I right? How do I set the title?

//the href is dynamic so I can't set them one by one because I have 100+ html file here
<a href="test.html" target="_blank">open me<a>

解决方案

As you have it, this is not possible because your links are just normal HTML links. When the new page opens in a new tab, the current page will not have any reference to it and so cannot change it in any way. You will need to open the page using javascript and set the title that way.

You can dynamically set this up in window onload to find all a tags and add a click event whihc opens the window and sets the title.

If you want different titles for each page, you can store this in a data- attribute in the a tag.

Note tho that this will only work with pages in the same domain (for security), and that it does not handle people right clicking and pressing "Open in New Window". Middle click in Windows does seem to work however.

HTML

<a href="test.html" data-title="A new page" target="_blank">open me</a>

JavaScript

window.addEventListener("load", function() {

    // does the actual opening
    function openWindow(event) {
        event = event || window.event;

        // find the url and title to set
        var href = this.getAttribute("href");
        var newTitle = this.getAttribute("data-title");
        // or if you work the title out some other way...
        // var newTitle = "Some constant string";

        // open the window
        var newWin = window.open(href, "_blank");

        // add a load listener to the window so that the title gets changed on page load
        newWin.addEventListener("load", function() {
            newWin.document.title = newTitle;
        });

        // stop the default `a` link or you will get 2 new windows!
        event.returnValue =  false;
    }

    // find all a tags opening in a new window
    var links = document.querySelectorAll("a[target=_blank][data-title]");
    // or this if you don't want to store custom titles with each link
    //var links = document.querySelectorAll("a[target=_blank]");

    // add a click event for each so we can do our own thing
    for(var i = 0; i < links.length; i++) {
        links[i].addEventListener("click", openWindow.bind(links[i]));
    }

});

Sample JsFiddle

这篇关于如何设置新的浏览器标签的标题？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！