日语字符在Google Chrome中显示为其他符号

时间:2017-08-27 04:45:06

标签: javascript google-chrome unicode character mojibake

我有一个非常简单的JavaScript应用程序,它必须渲染一些日文字符(特别是半角假名)。

以下是所有这些:ヲァィィィャャュュッアイウエオカキクケコサシネネネネフフフ<<<<<<<<<

但是,当它们呈现在屏幕上时,它们会显示为其他随机字符,如下所示。Here's a screenshot.

更奇怪的是,如果我将随机渲染的字符复制并粘贴到我的代码编辑器中,它会变回日语!

我知道Chrome能够呈现日文字符,因为当我输入此问题时,我现在可以看到它。所以,我完全不知道为什么会在我的程序中发生这种情况。

Firefox似乎没有分享这个问题,但Safari确实如此。

这是我的代码。我有一个字符串中的所有字符,我随机选择一个来显示(这是出于艺术目的)。

let randomChar = function() {
  const halfWidthKana = "ヲァィゥェォャュョッアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤユヨラリルレロワン";
  const numerals = "0123456789";

  let possible = halfWidthKana + numerals;

  return possible.charAt(Math.floor(Math.random() * possible.length));
};

然后随机选择的字符显示在li标签内

let li = document.createElement("li");
li.appendChild(document.createTextNode(randomChar()));

以下是我的应用程序形成的唯一HTML文件:

<!DOCTYPE html>
<html>
    <head>
        <title>Japanese Text</title>
        <meta charset="utf-8" />
        <meta name="google" value="notranslate">
        <link rel="stylesheet" href="styles.css">
        <script src="generate.js"></script>
        <script src="Column.js"></script>
    </head>
    <body>
        <div id="lines"></div>
    </body>
</html>

1 个答案:

答案 0 :(得分:1)

我也可以在我的Mac上重现这一点。

Chrome的检查员显示正在使用字体“Songti SC”。切换到不同的字体可以解决此问题。

https://crbug.com/544402讨论了更多细节。