使用 JavaScript 設置字符集元標記

Question

我試圖在這里追蹤一個錯誤： https : //github.com/OscarGodson/EpicEditor/issues/184#issuecomment-8805982

根據所有信息，似乎是因為瀏覽器默認使用用戶的本機字符集（在本例中為ISO-8859-1 ）而不是像我的機器和美國其他機器上的UTF-8 。 我猜想修復是使用 HTML 強制編碼為UTF-8 ：

 <meta charset='utf-8'> 

要么

<meta http-equiv='Content-Type' content='Type=text/html; charset=utf-8'>

但是，JS 不起作用。 在第一個例子中：

charsetMetaTag = self.editorIframeDocument.createElement('meta');
charsetMetaTag.charset = 'utf-8';
self.editorIframeDocument.getElementsByTagName('head')[0].appendChild(charsetMetaTag);

我剛取回注入到 DOM 中的以下內容：

<meta>

在第二個示例中，沒有設置http-equiv ：

charsetMetaTag = self.editorIframeDocument.createElement('meta');
charsetMetaTag['http-equiv'] = 'Content-Type';
charsetMetaTag['content'] = 'text/html; charset=utf-8';
self.editorIframeDocument.getElementsByTagName('head')[0].appendChild(charsetMetaTag);

我得到以下 HTML：

<meta content="text/html; charset=utf-8">

是的，我需要動態地執行此操作，因為我正在動態創建 iframe。這甚至可能不是問題，但這就是它的樣子。 我能想到的唯一“黑客”是以某種方式使用innerHTML ......

Answer 1

您無法通過設置 charset 屬性來設置 charset 內容屬性，因為它們不會相互反映。 事實上，沒有反映字符集內容屬性的屬性。

http-equiv 內容屬性由 httpEquiv 屬性反映，因此

 charsetMetaTag['httpEquiv'] = 'Content-Type';

將正確創建元元素。

但這都不重要。 字符集是由解析器建立的，所以在解析完 HTML 之后在 JavaScript 中構造元元素對文檔的字符集完全沒有影響。

Answer 2

正如 Alohci 所說，從 JS 創建與字符集相關的元標記不會對當前頁面產生太大影響。

在我的用例中，我需要能夠將當前頁面序列化為字符串並將其保存到某個后端。 附加缺少的字符集元標記（如果不存在）對於此類用例很有用。

作為側節點，不要忘記根據 HTML5 規范，字符集元標簽應該在開頭。 看到這個答案。 這個簡單的細節導致了我的應用程序中的一個重要錯誤 :)

你應該使用：

document.head.insertBefore(charsetMetaTag,document.head.firstChild);

Answer 3

我同意@alohci 和@sebastien-lorber 的答案。

但只是解決您的原始問題

<meta>

使用 setAttribute 方法

charsetMetaTag.setAttribute("charset", "UTF-8");

並遵循@sebastien-lorber 的建議，將輸出

<meta charset="UTF-8">

作為 head 的第一個子元素