javascript - 通过 JavaScript 在 HTML 中正确编码变体选择器

Question

在 Unicode 中，a variation selector可以用于多种目的。我使用 VS15 (︎) 来防止浏览器(全部有 bug)将某些字符显示为表情符号。

我需要对 Unicode 字符 128 及以上进行编码，因为我们不仅发现了数据库问题，还发现了浏览器错误。即使使用建议的修复方案，VS15(变体选择器 15:︎)也无法正确编码:

HTML，来自数据库，在渲染之前

😏︎

用于呈现 HTML 的 XML 编码函数和字符编码函数:

function xml_encode(s)
{
 var r = '';
 var skip = 0;
 for (var i = 0; i < s.length; i++)
 {
  if (skip > 0) {skip--;}
  else if (character_code(s, i) > 127)
  {
   r += '&#' + character_code(s, i) + ';';
  }
  else {r += s.charAt(i);}
 }

 return r;
}

function character_code(s, i)
{
 i = i || 0;
 var c = s.charCodeAt(i), hi, low;

 if (0xD800 <= c && c <= 0xDBFF)
 {
  hi = c;
  low = s.charCodeAt(i + 1);
  if (isNaN(low)) {console.log('Error: high surrogate not followed by low surrogate in fixedCharCodeAt()');}
  c = ((hi - 0xD800) * 0x400) + (low - 0xDC00) + 0x10000;
 }

 if (0xDC00 <= c && c <= 0xDFFF) {c = false;}

 return c;
}

此代码的一个示例使用是当用户从页面的可视化编辑切换到 XML 编辑时。 如何确保变体选择器正确编码？

Answer 1

let s = 'a😏︎';
// U+0061 ‹a› \N{LATIN SMALL LETTER A}
// U+1F60F ‹😏› \N{SMIRKING FACE}
// U+FE0E ‹◌︎› \N{VARIATION SELECTOR-15}
Array.from(s).map(c => {
    const cp = c.codePointAt(0);
    return cp < 128 ? c : '&#' + cp + ';';
}).join('')
// 'a&#128527;&#65038;'