本博客日IP超过2000,PV 3000 左右,急需赞助商。
极客时间所有课程通过我的二维码购买后返现24元微信红包,请加博主新的微信号:xttblog2,之前的微信号好友位已满,备注:返现
受密码保护的文章请关注“业余草”公众号,回复关键字“0”获得密码
所有面试题(java、前端、数据库、springboot等)一网打尽,请关注文末小程序
腾讯云】1核2G5M轻量应用服务器50元首年,高性价比,助您轻松上云
Emoji 是可以插入文字的图形符号。它是一个日语词,e表示"絵",moji表示"文字"。连在一起,就是"絵文字"。Emoji 在上个世纪90年代,由日本电信商引入服务,最早用于在短消息之中插入表情。2007年,苹果公司的 iPhone 支持了 Emoji,导致它在全世界范围的流行。
国内的聊天应用也都支持 Emoji 。QQ默认经典表情从2003年开始一直支持到现在。
Unicode 标准化
早期的 Emoji 是将一些特定的符号组合替换成图片,比如将:)替换成。这种方法很难标准化,能够表达的范围也有限。
2010年,Unicode 开始为 Emoji 分配码点。也就是说,现在的 Emoji 符号就是一个文字,它会被渲染为图形。
由于越来越受欢迎,Emoji 的国际标准在 2015 年出台,目前已经是 5.0 版了。
- Emoji 1.0:2015年8月
- Emoji 2.0:2015年11月
- Emoji 3.0:2016年6月
- Emoji 4.0:2016年11月
- Emoji 5.0 (beta):2017年3月
截止2017年4月,列入 Unicode 的 Emoji 共有2389个。详见:http://www.unicode.org/emoji/charts/full-emoji-list.html
渲染实现
Unicode 只是规定了 Emoji 的码点和含义,并没有规定它的样式。举例来说,码点U+1F600表示一张微笑的脸,但是这张脸长什么样,则由各个系统自己实现。
因此,当我们输入这个 Emoji 的时候,并不能保证所有用户看到的都是同一张脸。如果用户的系统没有实现这个 Emoji 符号,用户就会看到一个没有内容的方框,因为系统无法渲染这个码点。
目前,苹果系统、安卓系统、Twitter、Github、Facebook 都有自己的 Emoji 实现。
使用方式
Emoji 虽然是文字,但是无法书写,必须使用其他方法插入文档。
(1)最简单的方法当然是复制/粘贴,你可以到 getEmoji.com 选中一个 Emoji 贴在自己的文档即可。
(2)另一种方法是通过码点输入 Emoji。以 HTML 网页为例,将码点U+1F600
写成 HTML 实体的形式😀
(十进制)或😀
(十六进制),就可以插入网页。码点到这个页面查询。
(3)JavaScript 输入 Emoji,可以使用 node-emoji 这个库。
var emoji = require('node-emoji'); // 返回 coffee 的 Emoji emoji.get('coffee'); // 返回文字标签对应的 Emoji // https://www.webpagefx.com/tools/emoji-cheat-sheet/ emoji.get(':fast_forward:'); // 将文字替换成 Emoji emoji.emojify('I :heart: :coffee:!'); // 随机返回一个 Emoji emoji.random(); // 查询 Emoji // 返回结果是一个数组 emoji.search('cof');
(4)还可以通过 CSS 插入 Emoji。
<link href="https://afeld.github.io/emoji-css/emoji.css" rel="stylesheet"> <i class="em em-baby"></i>
Emoji 组合
Unicode 除了使用单个码点表示 Emoji,还允许多个码点组合表示一个 Emoji。
其中的一种方式是"零宽度连接符"(ZERO WIDTH JOINER,缩写 ZWJ)U+200D。举例来说,下面是三个 Emoji 的码点。
- U+1F468:男人
- U+1F469:女人
- U+1F467:女孩
上面三个码点使用U+200D
连接起来,U+1F468 U+200D U+1F469 U+200D U+1F467
,就会显示为一个 Emoji ,表示他们组成的家庭。如果用户的系统不支持这种方法,就还是显示为三个独立的 Emoji 。
参考链接
最后,欢迎关注我的个人微信公众号:业余草(yyucao)!可加作者微信号:xttblog2。备注:“1”,添加博主微信拉你进微信群。备注错误不会同意好友申请。再次感谢您的关注!后续有精彩内容会第一时间发给您!原创文章投稿请发送至532009913@qq.com邮箱。商务合作也可添加作者微信进行联系!
本文原文出处:业余草: » web评论框支持emoji(表情符号)