1
我正在開發Chrome擴展的設計。我希望能夠更改標籤中顯示的標題，而不會改變真實的<title />標籤。在後臺腳本中，您可以將標題作爲只讀值訪問。通常，您使用內容腳本並更改實際的<title />標記。可能使用ShadowDOM更改窗口/標籤標題
我正在試驗ShadowDOM以查看這是否是一個選項。這個想法是ShadowDOM以可視方式顯示，但不是真實DOM的一部分，不會影響真實頁面。
但是，在我的測試中，我可以添加陰影<head />和<title />元素，但它們不會更改頁面標題中顯示的內容。我猜這是設計的，因爲瀏覽器可能從真正的dom中獲得這些值，但我想檢查以確定是否有方法顯示「陰影標題」。
考慮：
<html lang="en">
<head>
<title>Shadow DOM Example</title>
<meta charset="UTF-8" />
<script>
window.addEventListener("load", function() {
/** Sanity check, change the content of a part of th body **/
let realHost = document.getElementById("shadowHost");
let hostShadow = realHost.createShadowRoot();
hostShadow.textContent = "Shadow overlay on the body";
/** Try Creating a Shadow in the Title **/
let realTitle = document.getElementsByTagName("head")[0].getElementsByTagName("title")[0];
let titleShadow = realTitle.createShadowRoot();
titleShadow.textContent = "Created in titleShadow";
/** Try Creating a Shadow in the Head, then add title **/
let realHead = document.getElementsByTagName("head")[0];
let headShadow = realHead.createShadowRoot();
shadowTitle = document.createElement("title");
shadowTitle.textContent = "Created in headShadow";
headShadow.appendChild(shadowTitle);
}, false);
</script>
</head>
<body>
<div id="shadowHost">
Original Text
</div>
</body>
我得到如下：
爲什麼你不在原始的'document'中設置標題？ – guest271314
由於這將是一個擴展，我想避免頁面原始腳本使用標題的情況。我們的想法是隻保留原始頁面，但只更改瀏覽器中標籤標題中顯示的標題。原始網頁中的腳本也可以修改標題，這意味着您需要始終監視更改並與頁面上的其他javascript進行競爭。 –
不符合要求。原始文檔中只有一個'