获取字符串中的#prefixed单词并将它们替换为可点击的链接

Posted 2023-03-25

【中文标题】获取字符串中的#prefixed单词并将它们替换为可点击的链接

【英文标题】：Get #prefixed words in a string and replace them to clickable links

【发布时间】：2021-11-03 14:52:26

【问题描述】：

我有一些带有#prefixed单词的字符串

例如：

评论 1：我是一个#smart 人。

评论 2：我喜欢 #code 新事物。

评论 3：我有一个#new 概念。

我希望它在这个字符串中找到#items，我正在使用下面的部分。

var result       = $.grep(comment.split(' '), function(item) 
    var hashWords = /^#/.test(item);
    return hashWords;
);

我会用上面的代码从上面的cmets中得到每个#words

#智能

#代码

#新

但我希望它替换为可点击的链接

评论1：我是#smart人。

评论2：我喜欢#code新事物。

评论 3：我有一个#new 的概念。

由于我是 jquery 新手，请帮我找出解决方案。

【问题讨论】：

请提供一个最小的、可重现的例子：***.com/help/minimal-reproducible-example

【参考方案1】：

考虑以下内容。

$(function() 
  function replacePrefix(target) 
    var regex = /\#(\w+)/gmi;
    var subst = `<a href='https://www.google.com?hashtag=$1'>#$1</a>`;
    var myText;
    $(target).each(function(i, el) 
      myText = $(el).html();
      $(el).html(myText.replace(regex, subst));
    );
  

  replacePrefix(".comment");
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <div class="comment">I am a #smart person.</div>
  <div class="comment">I love to #code new things.</div>
  <div class="comment">I have a #new concept.</div>
</div>

传入一个选择器或一个元素，它会遍历每一个，寻找前缀，例如#new，并用HTML替换它们：

<a href='https://www.google.com?hashtag=new'>#new</a>