demo

Question

有没有办法让一个单词的每个实例自动变成一个链接？

所以，例如，每当我写“apple”时，它会自动格式化为<a href="www.apple.com" class="whatever" target="_blank">apple</a>

我假设我可以使用javascript或者可能使用jquery。

谢谢！

Answer 1

非常简单的例子......

的jQuery

var span = $('span');
    span.html(function(i,html){
        replaceTextWithHTMLLinks(html);
    }); // jQuery version 1.4.x


function replaceTextWithHTMLLinks(text) {
  var exp = /(apple)/ig;
    return text.replace(exp,"<a class='link' href='http://www.$1.com' target='_blank' >$1</a>"); 
}

html

<span> 
An apple a day, makes 7 apples a week!
</span>

demo

Answer 2

这是一个简单的jQuery插件，可以解决这个问题。它只会选择文本节点，这样如果你有一个带有apple类或id apple的元素，它就不会被替换。此外，如果您有一个链接<a href="#">apple</a>，它将不会被替换（可能比您需要的多一点，但我想我还是会发布它）：

(function($) {
    $.fn.replacetext = function(target, replacement) {
         // Get all text nodes:
         var $textNodes = this
                 .find("*")
                 .andSelf()
                 .contents()
                 .filter(function() {
                     return this.nodeType === 3 &&
                         !$(this).parent("a").length;
                 });

         // Iterate through the text nodes, replacing the content
         // with the link:
         $textNodes.each(function(index, element) {
             var contents = $(element).text();
             contents = contents.replace(target, replacement);
             $(element).replaceWith(contents);
         });
    };
})(jQuery);

用法：

$("body").replacetext(/apple/gi, "<a href='http://www.$&.com'>$&</a>");

工作示例：http://jsfiddle.net/andrewwhitaker/VmHjJ/

请注意，由于使用$("*")选择器，这可能会变得非常低效。如果可能，您应该用更具体的内容替换它（或者完全删除.find("*").andSelf()部分并将插件传递给更具体的选择器。）

全局自动将关键字设为链接

2 个答案:

demo