如何更改打开的 YouTube 视频的 window 标题以包含频道名称？

Question

基本上我想要扩展程序做的是，当我打开一个 YouTube 视频时，获取 YouTube 频道的名称并将其添加到 window 标题，这样我就可以只阻止一些 YouTube 视频渠道。因此，如果 youtube 频道名称是“Mark Rober”并且视频标题（因此也是 window 标题）是“NASA 是在浪费钱吗？”我想将 window 标题更改为“NASA 是在浪费钱吗？- Mark Rober”。

我尝试为此写一个 chrome 扩展，但我不知道如何获取 youtube 频道的名称以将其放入 window 标题中。我尝试使用 document.querySelector 和 document.getElementById 以及 return “null”或 undefined。可能是因为我不知道如何具体访问频道名称，因为它在 HTML.

中并没有真正的唯一 ID

我也考虑过通过 YouTube API 进行此操作，但这需要 OAuth 令牌。由于这个扩展与许多网络拦截器一起使用真的很有帮助，我很乐意在它工作时分享它，并使用一个可能不太容易访问的令牌（我认为）。

因此，如果有人可以帮助我做到这一点，我将不胜感激:)

Answer 1

我不确定他们的代码中发生了什么，也许 ID 不是唯一的或者什么的，但无论如何，我已经设法使用最丑陋的表达式获取频道名称：

document.getElementById("primary-inner").children[7].children[1].children[0].children[0].children[0].children[0].children[1].children[0].children[0].children[0].children[0].children[0].innerHTML

（您是否知道页面加载需要时间的问题，如果脚本在页面加载完成之前运行，您可能会得到 null？有一些技术可以解决这个问题，在以防它对你来说是新的。）

编辑：

适合我的 Chrome 扩展的完整代码：

displayChannelName.js:

console.log("displayChannelName started.");

let nodeLoaded = setInterval(function () {
    let node = document.getElementById("primary-inner");
    if (node != undefined) {
        let channelName = node.children[7].children[1].children[0].children[0].children[0].children[0].children[1].children[0].children[0].children[0].children[0].children[0].innerHTML;
        console.log("channel name: " + channelName);
        document.title = document.title + " - " + channelName;
        clearInterval(nodeLoaded);
    };
}, 500);

manifest.json:

{
  "name": "YouTube Channel Name",
  "version": "1",
  "description": "Display YouTube Channel Name",
  "manifest_version": 3,
  "content_scripts": [ {
      "matches": ["https://www.youtube.com/watch*"],
      "js": ["displayChannelName.js"]
    } ]
}

编辑：

使用 MutationObserver：

displayChannelName.js:

console.log("displayChannelName script started.");
let currTitle;

function updateTitle(node) {
    if (document.title != currTitle) {
        console.log("updateTitle function called.");
        if (node == undefined) {
            node = document.getElementById("primary-inner");
        };
        setTimeout(function () { // wait a little in case title changes before the node reloads
            let channelName = node.children[7].children[1].children[0].children[0].children[0].children[0].children[1].children[0].children[0].children[0].children[0].children[0].innerHTML;
            document.title += " - " + channelName;
            currTitle = document.title;
        }, 500);
    };
};

let nodeLoaded = setInterval(function () {
    // update title on page load
    let node = document.getElementById("primary-inner");
    if (node != undefined) {
        updateTitle(node);
        clearInterval(nodeLoaded);
    };
}, 500);

// listen for future changes
new MutationObserver(function (mutations) {
    updateTitle(undefined);
}).observe(
    document.querySelector("title"),
    { subtree: true, characterData: true, childList: true }
);

如何更改打开的 YouTube 视频的 window 标题以包含频道名称？

How can I change the window title of an opened youtube video to include the channel name?

javascript

youtube

google-chrome

google-chrome-extension