使用 jquery 仅替换 div 中的文本

javascript jquery

2022-08-30 04:46:07

我有一个像这样的div：

<div id="one">
       <div class="first"></div>
       "Hi I am text"
       <div class="second"></div>
       <div class="third"></div>
</div>

我正在尝试使用jquery仅将文本从“嗨，我是文本”更改为“嗨，我是替换”。这可能很容易，但我无法做到。

使用只会清空整个 div。$('#one').text('')#One

答案 1

文本不应单独存在。将其放入元素中。span

将其更改为：

<div id="one">
       <div class="first"></div>
       <span>"Hi I am text"</span>
       <div class="second"></div>
       <div class="third"></div>
</div>

$('#one span').text('Hi I am replace');

答案 2

找到文本节点（）并替换：nodeType==3textContent

$('#one').contents().filter(function() {
    return this.nodeType == 3
}).each(function(){
    this.textContent = this.textContent.replace('Hi I am text','Hi I am replace');
});

请注意，根据文档，您可以替换上面中的硬编码，这样可以更清楚地说明您在做什么。3Node.TEXT_NODE

$('#one').contents().filter(function() {
    return this.nodeType == Node.TEXT_NODE;
}).each(function(){
    this.textContent = this.textContent.replace('Hi I am text','Hi I am replace');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="one">
       <div class="first"></div>
       "Hi I am text"
       <div class="second"></div>
       <div class="third"></div>
</div>