从文本创建链接

Question

我有代码

<div class="row1">
<em>My text</em>
</div>

如何建立如下链接：

<div class="row1">
<em><a href="/mylink">My text</a></em>
</div>

我知道这个问题很简陋，但找不到相同的简单解决方案。

Answer 1

您可以contents()使用wrapAll()：

$(".row1 em").contents().wrapAll("<a href='/mylink'></a>");

Answer 2

$('.row1 em').html(function(i, contents) {
    return '<a href="/mylink">' + contents + '</a>';
});

或

 $('.row1 em').contents().wrapAll('<a href="/mylink" />');

Answer 3

你可以尝试这个 -

$(".row1 em").contents().wrapAll("<a href='/mylink'></a>")

Answer 4

示例：

$('.row1 em').wrap('<a href="/mylink" />');

更新：由于这会将<a>标记包裹在<em>而不是其内容中，正确的方法是使用$('.row1 em').contents().wrap('<a href="/mylink" />');作为弗雷德里克所说的

Answer 5

$('.row1 em').html().wrap('<a href="/mylink">');

Answer 6

如果您的目标是超链接文本，并且您可以提供替代解决方案，则以下内容实现相同：

HTML：

<div class="row1">
    <em>My text</em>
</div>

CSS：

.row1 {
    cursor:pointer;
}

JS：

$('.em').click(function() {
    location.href = '/mylink';
});