javascript - 更改文本以与 javascript 链接

Question

我的目标是将 span .name 中的文本更改为带有链接的元素-

  <div class="input-wrap">
      <span class="name">favorite 1</span>
  </div>

如何使用 JS 来添加指向该元素的链接，使其看起来像这样：

 <div class="input-wrap">
      <span class="name"><a href="/specyficwebsite.html">favourite 1</a></span>
  </div>

Answer 1

.wrapInner()将元素包裹在传递的值周围。

尝试这个：

$(".name").wrapInner("<a href='/specyficwebsite.html'></a>");

在这里拉小提琴。

Answer 2

你可以：

$('span.name').html(function () {
    return $('<a>').attr('href', '/specyficwebsite.html').text($(this).text());
});

在此处查看演示 jsFiddle。

生成的 HTML：

<span class="name"><a href="/specyficwebsite.html">favourite 1</a></span>

Answer 3

试试.wrapInner()喜欢

$(".name").wrapInner( '<a href="/specyficwebsite.html"></a>' );

看到这个FIDDLE你也可以试试喜欢

var txt = $('.name').text();
$('.name').html('<a href="/specyficwebsite.html">' + txt + '</a>');

或者直接

$('.name').html('<a href="/specyficwebsite.html">' + $('.name').text() + '</a>');

试试这个小提琴

Answer 4

你可以这样做：

$(".name").html(function(){
$(this).wrap("<a href='/specyficwebsite.html'></a>")
})

演示小提琴

Answer 5

尝试这样的事情

        $(function(){
            var link = '<a href="/specyficwebsite.html">'+$('.name').text()+'</a>';
            $('.name').html(link);
        })

Answer 6

这是小提琴

var $name = $(".name");
var txt = $name.text();
$name.html('<a href="/specyficwebsite.html">' + txt + '</a>');