Печать эмодзи с помощью JavaScript и HTML

Почему это работает:

<p id="emoji">&#x1f604;</p>

И это не:

document.getElementById("emoji").innerHTML = String.fromCharCode(parseInt('1f604', 16));

person Tom Söderlund    schedule 10.03.2014    source источник
comment
Добро пожаловать в ужасы UTF-16 и суррогатных пар.   -  person SLaks    schedule 11.03.2014


Ответы (2)


«Символ» в терминах JS на самом деле является кодовой единицей UTF-16, а не полным символом Unicode. (Это печальное положение вещей восходит к древним временам, когда не было разницы*.) Чтобы использовать символ за пределами базовой многоязычной плоскости, вы должны написать его в кодировке UTF-16 в форме суррогатная пара из двух 16-битных кодовых единиц:

String.fromCharCode(0xD83D, 0xDE04)

В ECMAScript 6 мы получим некоторые интерфейсы, которые позволят нам работать со строками, как если бы они были полными кодовыми точками Unicode, хотя они неполны и являются лишь фасадом над типом String, который все еще хранится как последовательность кодовых единиц. Тогда мы сможем сделать:

String.fromCodePoint(0x1F604)

См. этот вопрос, чтобы узнать код полифилла, позволяющий использовать эту функцию в современных браузерах.

(*: Когда я получу доступ к машине времени, я оставлю Гитлера в покое и вернусь, чтобы изобрести UTF-8 раньше. UTF-16, должно быть, никогда не было!)

person bobince    schedule 11.03.2014

Вы также можете использовать хакерский метод, если не хотите включать String.fromCodePoint() в свой код. Он заключается в создании виртуального элемента...

elem=document.createElement('p')

... Заполнение его рабочим HTML...

elem.innerHTML = "&#x1f604"

... И, наконец, получить его значение

value = elem.innerHTML

Короче говоря, это работает из-за того, что, как только вы устанавливаете значение контейнера HTML, значение преобразуется в соответствующий символ.

Надеюсь, я смог помочь.

person Thomas P.    schedule 15.07.2014