仅替换 jQuery 函数中的部分文本

Question

我正在使用此解决方案来替换表情符号列表：

(function($){
   var emojies = ["smile", "smiley", "grin", "joy"];
   var emojiRegex = new RegExp(":("+ emojies.join("|") +"):","g");
   $.fn.toEmoji = function(){
        return this.each(function() {
            this.innerHTML = this.innerText.replace(emojiRegex,function(fullmatch,match){
                return '<span class="emoji '+match.toLowerCase()+'"></span>';
            });                
        });
   };
})(jQuery);
//And use like
$(document).ready(function(){
    $(".content div").toEmoji();
});

但这会替换所有内容 div (this.innerHTML...)，但是，我没有办法这样做，只能替换 :emoji: 而不是所有文本？

因为，如果文本有换行，例如：

Hi!

How are you?

将取代：

Hi! How are you?

除了其他问题...那么，怎么办呢？

Answer 1

问题是您从 DIV 读取为 innerText，其中不包括 HTML 标签，如 <br/>。相反，您可以像这样使用 innerHTML 从 DIV 读取：

   $.fn.toEmoji = function(){
        return this.each(function() {
            this.innerHTML = this.innerHTML.replace(emojiRegex,function(fullmatch,match){
                return '<span class="emoji '+match.toLowerCase()+'"></span>';
            });                
        });
   };

注意 this.innerHTML.replace 而不是 this.innerText.replace!

JSFiddle：http://jsfiddle.net/ybj7gpn6/（单击按钮后检查 HTML 以查看是否存在跨度——看起来像空白 space）

仅替换 jQuery 函数中的部分文本

Replace only part of text in jQuery function

javascript

jquery

innerhtml