如何在 jQuery 中替换嵌套标签后的文本？

在本文中，我们将了解如何使用 jQuery 替换嵌套标签后的文本。可以遵循一种主要方法。

方法：我们使用 click()、contents() 和 filter() 方法以及 this、nodeType 和 nodeValue 属性。有一个 id 为outer-tag的除法元素和一个 span 标签，其中嵌套了一个嵌套标签类。还定义了一个按钮，它在单击时替换嵌套标记之后的文本。我们使用 点击（） 方法。

此方法包含一个在单击按钮时执行的匿名函数。我们选择 div 元素并使用contents()获取其所有子节点，包括任何文本节点 方法。

接下来，我们使用filter()过滤所有这些作为文本节点的子节点 方法。只需使用nodeType属性检查每个子节点的节点类型。如果nodeType属性返回值 3，则给定节点是文本节点。现在，为了获取嵌套标记之后的文本，我们通过索引（索引 1）从所有过滤的文本节点中选择第二个文本节点。要替换选定文本节点的文本值，我们使用nodeValue属性，它可以帮助我们设置文本节点的新值。

示例：在这个特定示例中，嵌套标记后的原始文本是“CS hub for geeks”。 .我们将此文本替换为“面向极客的计算机科学门户”。使用上面讨论的方法。

HTML

  

    
    
  
    
    
        body {
            text-align: center;
        }
  
        button {
            margin-top: 2rem;
            cursor: pointer;
        }
    

  

    GeeksforGeeks
    jQuery - Replace text after a nested tag
      
    
        
            GeeksforGeeks is a  C.S. hub for geeks.
    
    Click me to change text after nested tag
    
  
        $("button").click(function () {
            $("#outer-tag").contents().filter(function () {
                return this.nodeType == 3;
            })[1].nodeValue = "Computer Science portal for geeks.";
        });
    

  

输出：