最近在做我們學校的表白墻網站，在做到評論功能的時候自然而然就想到了emoji-??。
于是就去搜了一些這方面的資料，發現了比較好的三個emoji庫：
- emojione（第一個開源且完整的emoji網站，編碼方面100%免費，且與項目有非常好的整合性）
- Twemoji (完全免費，簡單小巧，API相比emojione較少。)
- Twemoji Awesome (Twemoji社區的項目，純css顯示emoji)
綜合考慮最后選擇了emojione來實現，因為API比較多而且文檔十分友好。
1. 引入emojione
- 通過外鏈
<script src="https://cdn.jsdelivr.net/npm/emojione@3.1.2/lib/js/emojione.min.js"></script>
<link rel="stylesheet" />
- NPM
> npm install emojione
2. 生成emoji選擇界面
首先我們需要這些emoji的圖片，隨即我就去emojione官網下載了32×32px的PNG圖片，可是之后我發現圖片太多不可能讓我一個一個引入吧！
轉變思路，去看emojione的文檔，發現了一個提供API演示功能的emojione實驗室。
實驗室中有一個API可以把HTML中的unicode 轉換為圖片：.unicodeToImage(str)
于是我用JS Bin 做了一個小demo測試了一下,發現沒有什么問題。
OK，那么我們就可以通過這個API批量生成emoji的圖片了，可是emoji的Unicode碼去哪找呢？
官方提供了一個Unicode復制粘貼的網站：emojiCOPY
選中想要的emoji，之后點擊COPY就可以復制下來，然后再粘貼到剛才的JS Bin之中就可以批量生成圖片了：
之后把這些圖片的HTML直接復制到我們的項目之中：
讓人驚喜的是這些生成的img的alt是Unicode，這讓input顯示和用戶點擊同步也變得簡單了。
接下來只需要寫很簡單的JS就可以實現了：
$('.emoji').children().click((emoji)=> {
comment = comment + ' ' + emoji.target.alt + ' '
})
