如何围绕这个没有任何HTML标签的文本(使用jQuery)？

Question

<span id="subscription-toggle" class="list:subscription">

&nbsp;|&nbsp; <!-- I want to surround this with a div with a class -->

<span class="" id="subscribe-77" style="">
<a class="dim:subscription-toggle:subscribe-77:is-subscribed" href="http://localhost/taiwantalk2/topic/topic-with-two-tags-topic-with-two-tags-topic-with-two-tags/?action=bbp_subscribe&amp;topic_id=77&amp;_wpnonce=25988e5dac">Subscribe</a>
</span>

</span>

所以这应该是最终的结果:

<span id="subscription-toggle" class="list:subscription">

<div class="hide-this">&nbsp;|&nbsp;</div>

<span class="" id="subscribe-77" style="">
<a class="dim:subscription-toggle:subscribe-77:is-subscribed" href="http://localhost/taiwantalk2/topic/topic-with-two-tags-topic-with-two-tags-topic-with-two-tags/?action=bbp_subscribe&amp;topic_id=77&amp;_wpnonce=25988e5dac">Subscribe</a>
</span>

</span>

Answer 1

如果您希望环绕的文本节点div是唯一的文本节点（即它是其中唯一subscription-toggle不在另一个元素内的文本），那么您可以这样做：

$("#subscription-toggle").contents().filter(function() {
    return this.nodeType == 3;
}).wrap("<div class='hide-this'></div>");

您可以在此处查看示例。

或者，如果 中有多个文本节点span，并且您只想换行|字符，请将函数主体替换filter为以下行：

return $(this).text().indexOf("|") != -1;

您可以在此处查看该示例的工作情况。