jquery 用a标记 Package span标记，a标记的href目标与span的文本相同

wqsoz72f 于 2023-02-12 发布在 jQuery

关注(0)|答案(2)|浏览(165)

我的文档有许多 span 标记，如下所示：

<span class='myClass'>aaa</span>

我想把其中的每一项变成如下：

<a href="http://www.example.com/aaa" onclick="myfunc();"><span class='myClass'>aaa</span></a>

有什么方法可以做到这一点吗？可以是普通的JavaScript或jQuery（3.1.1）。

jquery

来源：https://stackoverflow.com/questions/72199988/wrapping-a-span-tag-with-an-a-tag-with-a-href-target-same-as-the-text-of-the-spa

2条答案

按热度按时间

a6b3iqyw1#

使用jQuery，您可以使用.each()迭代所有.myClass元素，然后使用.wrap() Package 它们

$(".myClass").each( function() {
  $(this).wrap('<a href="http://www.example.com/' + $(this).text() + '" onclick="myfunc();" />');
});

console.log($(".myClass").parent())

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<span class='myClass'>aaa</span>
<span class='myClass'>bbb</span>
<span class='myClass'>ccc</span>
<span class='myClass'>ddd</span>

https://api.jquery.com/wrap/

赞(0）回复(0）举报 2023-02-12

bt1cpqcv2#

使用此命令：

const els=document.querySelectorAll("span.myClass");
els.forEach((el)=>{
   const t=el.textContent;
   const aEl=document.createElement("a");
   aEl.href=`http://example.com/${t}`;
   aEl.appendChild(el.cloneNode(true))
   el.parentElement.insertBefore(aEl,el);
   el.remove()
})

赞(0）回复(0）举报 2023-02-12

我来回答

jquery 用a标记 Package span标记，a标记的href目标与span的文本相同

2条答案

相关问题

热门标签

最新问答