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

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

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

1. text() 。该方法选择标签，text函数的参数将文本追加到预先存在的标签中。该参数是HTML安全的，意味着内容将被准确地复制到标签上，而不考虑作为参数传递的HTML代码。

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

<!DOCTYPE html>
<html>
<head>
    <title>jQuery!!!</title>
    <script type="text/javascript" src=
    "https://code.jquery.com/jquery-3.5.1.min.js">
     </script>
    <style type="text/css">
        h1 {
            color: green;
        }
        body {
            text-align: center;
        }
    </style>
</head>
<body>
    <h1>Geeks Geeks</h1>
    <br>
    <button class="one">Correct Me!</button>
    <br>
    <br>
    <button class="two">Add Me!</button>
    <br>
    <span></span>
    <script type="text/javascript">
         $(".one").click(function() {$ ("h1").text("Geeks for Geeks!");
        });
  
         $(".two").click(function() {$ ("span").html("<h3>You can also Contribute.</h3>");
        });
    </script>
</body>
</html>

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

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