如何使用 jQuery 搜索和替换 HTML 元素？

在本文中，我们将讨论如何使用 jQuery 来搜索和替换 HTML 元素。就像在 Vanilla JavaScript（纯 JavaScript）中一样，jQuery 也提供了用于选择 HTML 标签的选择器，以便我们可以操作 HTML 标签的内容和属性。使用 jQuery 选择器，我们可以通过标签名称、ID 名称、类名称以及标签的位置来选择元素。

在下面的示例中，我们使用两种 jQuery 方法：一种是向现有 HTML 标签添加内容，另一种是在正文中添加新的 HTML 标签。

1. text( ) ：该方法选择标签，文本函数的参数将文本附加到预先存在的标签上。该参数是 HTML 安全的，这意味着无论作为参数传递的 HTML 代码如何，内容都将被精确复制到标签中。

2. html( ) ：该方法选择标签， html函数的参数将内容添加到所选标签。它是 HTML 特定的意思，它将检查参数是否是 HTML 内容并相应地添加它。

HTML

    jQuery!!!
    
     
    
        h1 {
            color: green;
        }
        body {
            text-align: center;
        }
    


    Geeks Geeks
    
    Correct Me!
    
    
    Add Me!
    
    
    
        $(".one").click(function()
        {
            $("h1").text("Geeks for Geeks!");
        });
  
        $(".two").click(function()
        {
            $("span").html("<h3>You can also Contribute.</h3>");
        });
    

输出：运行上述 HTML 文件后的页面

单击“纠正我！”后按钮

点击“添加我！”后按钮

其他重要的 jQuery 函数：

3. css( ) ：该方法用于选择和操作元素的CSS属性。

4. attr() ：该方法返回并更改 HTML 标记的属性。

5. val( ) ：该方法返回所有具有 value 属性的标签的值。它还可以通过向它传递参数来设置值。

如果要向标签添加多个 CSS 属性，那么更合适的方法是将属性赋予一个类，然后将类移除、添加或切换到标签中。此属性使 jQuery 非常易于使用和处理。

jQuery 提供 addClass()、removeClass() 和 toggleClass() 来添加、删除和切换类到 HTML 中的标签。