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

我有以下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>

$（“（关键字）”）。在（“”）之前；
$（“（关键字）”）。在（“”）之后；

---

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

您不能用jQuery选择这样的文本。 这里有一个非常简单的方法

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

var toReplace='（关键字）'； var containers=document.getElementsByClassName（“pi手风琴标题”）； Array.prototype.forEach.call（容器，函数（容器）{ container.innerHTML=container.innerHTML.replace（存储替换，$&'）； });

.pi手风琴标题a span{
颜色：红色；
}

编辑

如果要避免上述元素覆盖缺陷，可以利用

“：contains”

jQuery选择器。如果您使用的是

jQuery

，我实际上认为这是最好/最安全的方法，因为您只需重新编写父元素

var-toReplace='（关键字）'；
$（“：包含（“+toReplace+”）。每个（函数（）{
this.innerHTML=this.innerHTML.replace（toReplace，$&'）；
});

.pi手风琴标题a span{
颜色：红色；
}

$（'.pi手风琴标题'）。每个（函数（）{
this.innerHTML=this.innerHTML.replace（/（\（关键字\）/，“$1”）；
});

我试过使用jquery。抓取类名并获取文本或html，然后可以用

替换。用find word替换

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

var title=$（“.pi手风琴标题”）；
var text=title.html（）；
title.html（text.replace（/（\（关键字\）/g，“$&”）；
a
@progrAmmar我不想在我的数据库中添加html代码。我的链接是从数据库中动态提取的。我在（关键字）中有不同的词，因此我将根据不同的词将span放在不同的类中。此代码产生一个错误，即：TypeError:container为null您应该使用一个旧的/古怪的浏览器，奇怪的是它不支持
document.body
。下面是一个使用
getElementsByClassName
的新版本。如果您的浏览器不支持此操作，我无法帮助您：）。我不知道是什么问题，但在我的浏览器中（关键字）之前或之后没有插入跨距。我用Firefox、Chrome和Opera进行了检查，什么都没有……我所有的浏览器都是最新的，试着用
$（function（）{\*code here*\}）来包装你的代码包装器（或
window.addEventListener（“加载”，函数（）{\*code here*\}）；
）。此问题还可以解释
document.body===null
问题。在尝试对DOM执行任何操作之前，需要确保页面已加载。如果您的脚本插入到页面的开头（例如页眉），它会在加载页面之前执行。奇怪，但没有插入跨距…我应该使用body on load还是其他什么？是的，我可以在这里看到，但它在我的计算机上不起作用，我会重新启动它，我看不到任何其他明显的原因，说明这在我这方面不起作用。“我应该在负重时使用身体还是什么”很可能是真的。
var title = $(".pi-accordion-title");
var text = title.html();
title.html(text.replace(/(\(Keyword\))/g,"<span class='orange'>$&</span>"));