javascript - 如何让一些代码点表情符号值发挥作用

标签 javascript html

enter image description here例如:“笑得在地板上打滚”在浏览器中给出一个方 block 。如何让实际的表情符号显示出来而不是像 suqare 一样?

String.fromCodePoint(0x1F923)

这是 arups jsbin 的图片,如下所示: enter image description here

最佳答案

这个例子在 Firefox 61 上适用于我。输出是:

enter image description here

在 Google Chrome 上我有:

enter image description here

现在,尝试运行以下代码片段:

document.querySelector('.output').textContent = String.fromCodePoint(0x1F923);

console.log(String.fromCodePoint(0x1F923));
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>

<body>
  <p class='output'></p>
</body>

</html>

如果您仍然看到该方 block ,请检查浏览器的编码和默认字体。并检查它是否支持表情符号,就像我的 Google Chrome 上没有渲染它一样。

所以也许您需要使用第三方 JavaScript 库,例如 Twitter's Twemoji :

// I got the Unicode for that emoji(1F602) from www.unicode.org/emoji/charts/full-emoji-list.html
document.querySelector('.output').innerHTML = twemoji.convert.fromCodePoint('1F602'); 
<script src="//twemoji.maxcdn.com/2/twemoji.min.js?11.0"></script>

<p class="output"></p>

关于javascript - 如何让一些代码点表情符号值发挥作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51920863/

相关文章:

javascript - jquery:在div中加载html页面

javascript - scrollIntoView() 不工作 : does not taking in account fixed element

javascript - Kinetic.js 对包含形状和文本的多个组进行动画处理

html - table-cell 的 child 未占据 100% 的高度(仅适用于 FF)

jquery - 如何向动态创建的图像添加边框图像?

javascript - 如何从数组中提取对象?

javascript - 带有 expect 的 mocha 不适用于测试错误

php - Ajax 表单只能工作一次

php - 引用 php session 变量解析为 Javascript 中的变量

php - 为什么 mysql 代码不在数据库中提交值