重音字符的javascript編碼問題

Question

我有一個帶有UTF-8標頭的頁面：

<meta charset="utf-8" />

在頁面中，我使用umbraco詞典來獲取各種語言的內容。 當我在頁面上用德語打印時，它看起來很好：

<h1>@library.GetDictionaryItem("A")</h1>

解析為：

<h1>Ä</h1>德語

但是，如果我通過腳本輸入它：

<script type="text/javascript" charset="utf-8">
  var a = "@library.GetDictionaryItem("A")";
  alert(a);
</script>

警報打印：

ä

如果我做

<script type="text/javascript" charset="utf-8">
  var a = "Ä";
  alert(a);
</script>

警報打印：

Ä

那么，什么可以解釋這種現象，以及如何解決警報？ 據我所知，一切都是UTF-8，並且字典和頁面編碼都很好。 問題發生在Javascript中。

從我在此處的表格中可以看到，Javascript將字符解析為數字值。 我用“轉義，encodeUrl，decodeUrl”等沒有運氣。

chr  HexCode  Numeric   HTML entity     escape(chr)  encodeURI(chr) 

ä    \xE4     ä    ä          %E4          %C3%A4 

Answer 1

（FWIW：字符實體ä是ä ，而不是Ä 。）

這與字符編碼無關。 您正在將HTML 實體輸出到JavaScript字符串，然后要求瀏覽器顯示該JavaScript字符串，而不執行任何解釋HTML的操作（通過alert ）。 就像您實際鍵入的一樣：

<h1>&#228;</h1>

...（將在頁面上顯示ä ），以及

<script>
var a = "&#228;";
alert(a);
</script>

...不會。 HTML實體不會在任何了解HTML實體的地方使用。 alert無法解釋HTML。

但是，如果您這樣做：

<script>
var a = "&#228;";
var div = document.createElement('div');
div.innerHTML = a;
document.body.appendChild(div);
</script>

...您會在頁面上看到該字符，因為我們為實體提供了將解釋HTML的內容（ innerHTML ）。 因此，如果您輸入第一行：

var a = "@library.GetDictionaryItem("A")";

...然后在HTML上下文中使用a （如上所述），您將在文檔中獲得ä 。

如果您總是從Umbraco獲得十進制數字字符實體（例如ä ），由於它們定義了unicode代碼點，而JavaScript（通常）在其字符串中使用unicode代碼點*，則可以輕松地解析該實體：

function characterFromDecimalNumericEntity(str) {
    var decNumEntRex = /^\&#(\d+);$/;
    var match = decNumEntRex.exec(str);
    var codepoint = match ? parseInt(match[1], 10) : null;
    var character = codepoint ? String.fromCharCode(codepoint) : null;
    return character;
}
alert(characterFromDecimalNumericEntity("ä")); // ä

現場例子

*為什么要“主要”：JavaScript字符串由對應於UTF-16 代碼單元而不是Unicode代碼點的16位“字符”組成（您不能以16位存儲Unicode代碼點，需要21）。 基本多語言平面中的所有字符都適合一個UTF-16代碼單元，但是補充多語言平面 ， 補充表意文字平面 等中的字符需要一個字符使用兩個 UTF-16代碼單元。 這些字符之一將占據JavaScript字符串中的兩個“字符”。 上面的功能對他們來說將失敗。 有關JavaScript規范和Unicode FAQ的更多信息 。