巧用replace将文字表情替换为图片


Posted in Javascript onApril 17, 2014

微博或者论坛上常见的效果,选择表情插入文本域的时候,显示的是类似[哈哈]这样的字符串,下面是把表情字符串转换为图片表情的一种方法

<div id="test">abc</div>

var face ={'[哈哈]':'<img src="images/face/haha.gif" alt="" />','[流汗]':'<img src="images/face/liuhan.gif" alt="" />'} //完整的qq表情见本文末尾 var reg = /\[.+?\]/g; 
var str = '[哈哈]abc[流汗][流汗]'; //这里是获取到的文本域的value,简洁起见,直接使用了字符串。 
str = str.replace(reg,function(a,b){ 
return face[a]; 
}); 
document.getElementById('test').innerHTML = str;

qq表情包及对应face对象:http://pan.baidu.com/s/1qWPQbBu
Javascript 相关文章推荐
不错的JS中变量相关的细节分析
Aug 13 Javascript
JSON 和 JavaScript eval使用说明
Jun 13 Javascript
javascript来定义类的规范小结
Nov 19 Javascript
jQuery控制iFrame(实例代码)
Nov 19 Javascript
简单的分页代码js实现
May 17 Javascript
jQuery中的deferred使用方法
Mar 27 jQuery
jQuery pagination分页示例详解
Oct 23 jQuery
10个最受欢迎的 JavaScript框架(推荐)
Apr 24 Javascript
node-red File读取好保存实例讲解
Sep 11 Javascript
javascript实现超好看的3D烟花特效
Jan 01 Javascript
深入浅析vue全局环境变量和模式
Apr 28 Javascript
Vue2.0搭建脚手架
Mar 13 Vue.js
JavaScript事件委托的技术原理探讨示例
Apr 17 #Javascript
JS实现div居中示例
Apr 17 #Javascript
淘宝网提供的国内NPM镜像简介和使用方法
Apr 17 #Javascript
js调用后台、后台调用前台等方法总结
Apr 17 #Javascript
JS下载文件|无刷新下载文件示例代码
Apr 17 #Javascript
你可能不知道的JavaScript的new Function()方法
Apr 17 #Javascript
在JS中解析HTML字符串示例代码
Apr 16 #Javascript
You might like
用PHP制作的意见反馈表源码
2007/03/11 PHP
解析百度搜索结果link?url=参数分析 (全)
2012/10/09 PHP
拖拉表格的JS函数
2008/11/20 Javascript
JavaScript Cookie 直接浏览网站分网址
2009/12/08 Javascript
jquery validate poshytip 自定义样式
2012/11/26 Javascript
js(jQuery)获取时间的方法及常用时间类搜集
2013/10/23 Javascript
Javascript核心读书有感之语句
2015/02/11 Javascript
jQuery在线选座位插件seat-charts特效代码分享
2015/08/27 Javascript
JavaScript的instanceof运算符学习教程
2016/06/08 Javascript
jQuery解析与处理服务器端返回xml格式数据的方法详解
2016/07/04 Javascript
使用jquery/js获取iframe父子级、同级获取元素的方法
2016/08/05 Javascript
简单理解vue中Props属性
2016/10/27 Javascript
收集前端面试题之url、href、src
2018/03/22 Javascript
Element UI框架中巧用树选择器的实现
2018/12/12 Javascript
JavaScript数组去重的几种方法
2019/04/07 Javascript
Vue使用CDN引用项目组件,减少项目体积的步骤
2020/10/30 Javascript
python爬虫_自动获取seebug的poc实例
2017/08/05 Python
Python cookbook(数据结构与算法)从任意长度的可迭代对象中分解元素操作示例
2018/02/13 Python
Python比较2个时间大小的实现方法
2018/04/10 Python
Python获取昨天、今天、明天开始、结束时间戳的方法
2018/06/01 Python
python实现指定ip端口扫描方式
2019/12/17 Python
浅谈keras 模型用于预测时的注意事项
2020/06/27 Python
python模块内置属性概念及实例
2021/02/18 Python
使用CSS3的::selection改变选中文本颜色的方法
2015/09/29 HTML / CSS
html标签之Object和EMBED标签详解
2013/07/04 HTML / CSS
Stio官网:男女、儿童户外服装
2019/12/13 全球购物
《孔子拜师》教学反思
2014/02/24 职场文书
内勤主管岗位职责
2014/04/03 职场文书
大学生党员个人对照检查材料范文
2014/09/25 职场文书
五一劳动节活动总结
2015/02/09 职场文书
闪闪红星观后感
2015/06/08 职场文书
cf战队宣传语
2015/07/13 职场文书
助学金申请书该怎么写?
2019/07/16 职场文书
关于golang高并发的实现与注意事项说明
2021/05/08 Golang
浅谈Python魔法方法
2021/06/28 Java/Android
MySQL库表太大怎么办? 数据库分库分表项目实践
2022/04/11 MySQL