Question

我对该链接的新标签有疑问。

无论如何，我可以在用户点击链接之前设置浏览器标签标题吗？如果新标签中包含的html没有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>

Answer 1

正如您所知，这是不可能的，因为您的链接只是普通的HTML链接。当新页面在新选项卡中打开时，当前页面将不会对其进行任何引用，因此无法以任何方式更改它。您需要使用javascript打开页面并以此方式设置标题。

您可以在window onload中动态设置此内容，以查找所有a代码并添加click事件，同时打开窗口并设置标题。

如果您希望每个页面都有不同的标题，可以将其存储在data-标记的a属性中。

请注意，这只适用于同一域中的页面（为了安全起见），并且它不会处理人们右键单击并按下＆＃34;在新窗口中打开＆＃34;。然而，在Windows中进行中间点击确实有效。

<强> 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

Answer 2

您可以使用哈希传递标题并将其传递到另一个页面，如果这个页面是您的，则可以修改其代码。

第1页：

...
<a href="test.html#the_title_you_want" target="_blank">open me<a>
...

第2页 - 像这样修改正文开头标记：

<body onload="document.title=window.location.hash.replace('#','');">

如果您要链接的页面不属于您的页面，则可以使用window.open方法：

<a href="javascript:var mw = window.open('test.html');mw.document.title = 'the_title_you_want';">open me</a>

Answer 3

您有两种选择。使用纯HTML，您可以让用户打开链接，然后更改标题。或者您可以使用内联JavaScript更改标题。以下是您如何做到这两点：

方法1

通过分配目标属性来更改链接，然后使用该窗口名称来控制文档。例如，在您的链接中，它将是：<a href="whatever" target="theNewWindow">。每当您想要更改此页面的标题时，您都必须使用JavaScript：window.open("", "theNewWindow").document.title = "New Page Title!";但是，此方法的问题是具有该目标/窗口名称的所有链接都将在同一窗口中打开。此外，在第一次点击链接后，您的浏览器不会自动切换到新标签/窗口。

方法2

通过分配onclick属性来更改链接，该属性可以手动打开链接并立即更改页面标题。基本上它会看起来像：<a href="whatever" onclick="var w=window.open(this.href, '_blank'); (w.onload=function(){w.document.title='New Page Title!';})(); return false;">。这将打开基于href属性的窗口，立即更改标题，并设置窗口以在完成加载时将标题更改为该标题（以防真的有标题标记）。

这两种方法的问题（如其他人所述）是你的html文件必须在同一个域上。

Answer 4

如果您在第1页，并在新标签页中打开第2页，则无法从第1页设置第2页的标题。

如果您可以访问第2页，那么它是可能的，否则不是。

Answer 5

您可以在框架集中制作自己的页面，打开其他页面（您无法编辑的页面）。然后，您可以在加载页面2时动态更改标题，或者如果您使用window.open，则可以像其他人一样建议您从父页面控制标题。

Answer 6

我还没有看到addEventListener能够可靠地工作，尤其是在使用javascript打开新页面时。更改选项卡标题并使之可靠运行的最佳方法是设置超时，直到页面加载。您可能需要使用超时值，但是它可以工作。

var newWindow = window.open(url, '_blank');

setTimeout(function () {
    newWindow.document.title = "My Tab Name";
}, 100);

Answer 7

最简单的方法如下：

var winTab = window.open("", "_blank")

//Open URL by writing iframe with given URL

winTab.document.write("write iframe with your url in src here")

//Set Title for the new tab

winTab.document.title = "Form Title"

如何设置新浏览器选项卡的标题？

7 个答案:

方法1

方法2