Question

我有以下HTML：

<h5 class="pi-accordion-title">
    <a href="#" class="z">
        <span class="pi-accordion-toggle"></span>
            My Link (Keyword)
    </a>
</h5>

是手风琴链接的一部分。我想要做的是在（关键字）之前打开span标记并在之后关闭它。

我正在尝试使用以下JAVASCRIPT：

<script>
    $("(Keyword)").before("<span class='orange'>"); 
    $("(Keyword)").after("</span>");         
</script>

但它不起作用...控制台日志显示以下错误：语法错误，无法识别的表达式:(关键字）

Answer 1

您不能使用jQuery选择这样的文本。这是一个非常简单的方法does not even need jQuery。

这种方法的缺点是重写了容器的整个内容，这意味着如果要将事件附加到容器的某些子项，则必须在插入跨域后执行此操作。因此，我建议选择尽可能小的容器。

var toReplace =＆＃39;（关键字）＆＃39 ;; var containers = document.getElementsByClassName（＆＃34; pi-accordion-title＆＃34;）; Array.prototype.forEach.call（containers，function（container）{ container.innerHTML = container.innerHTML.replace（toReplace，＆＃39; $＆amp;＆＃39;）; }）;

.pi-accordion-title a span {
  color:red;
}

<h5 class="pi-accordion-title">
    <a href="#" class="z">
        <span class="pi-accordion-toggle"></span>
            My Link (Keyword)
    </a>
</h5>

修改

如果您想避免上述元素覆盖缺陷，可以使用":contains" jQuery选择器。如果你正在使用jQuery我实际上认为它是最好/最安全的方法，因为你只会重写父元素。

var toReplace = '(Keyword)'; $(":contains(" + toReplace + ")").each(function(){ this.innerHTML = this.innerHTML.replace(toReplace, '<span>$&</span>'); });

.pi-accordion-title a span { color:red; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <h5 class="pi-accordion-title"> <a href="#" class="z"> <span class="pi-accordion-toggle"></span> My Link (Keyword) </a> </h5>

Answer 2

65536 * 2147483647 = 140737488289792

Answer 3

我试过jquery.Grab类名并获取文本或html，然后你可以用.replace替换找到单词

var title = $(".pi-accordion-title");
var text = title.html();
title.html(text.replace(/(\(Keyword\))/g,"<span class='orange'>$&</span>"));

如何使用jquery在特定字符串之前和之后添加html标记

3 个答案: