如何执行jQuery代码

jQuery是一个开源的功能丰富的Javascript库，旨在简化HTML DOM树的遍历和操作、事件处理和CSS动画。它因其轻量级、快速、小型等特点而颇受欢迎，使其更容易使用。使用jQuery的目的是使javascript代码在网站上易于执行，因为jQuery将javascript中写的许多行代码包装成一个方法，可以用一行代码调用。出于这个原因，很多需要javascript的普通任务都可以由jQuery承担。

在这篇文章中，我们将看到如何为我们的网页执行jQuery代码。执行jQuery代码是很容易的，只需要注意几个步骤，然后我们就可以开始了。在进入主题之前，我们先看看如何在我们的网页上添加和使用jQuery。有两种方法可以将jQuery添加到我们的网页/网站上。

从官方网站下载jQuery库
在线使用jQuery CDN链接

让我们来看看我们的第一个方法，即从网站下载库。

方法1：下载jQuery库

下载库。我们需要下载开发版本用于我们的开发和测试目的。其余的版本是用于生产目的的。一旦你点击下载，它将带你到有可用链接的页面，点击所需的链接，然后在页面上右击并保存文件。注意，我们使用的文件是一个javascript文件，我们可以通过查看它的扩展名来检查它。现在，我们将看到如何将jQuery添加到我们的HTML文件中。请确保jQuery文件必须放在工作区里面。完成这许多步骤后，它将看起来像下面的图片。

宣布jQuery文件路径在 <head>标签部分内的<script>标签。

<script src="jquery-3.6.0.min.js"></script>

例子1：创建一个HTML文件，并在HTML文件中添加以下代码。

<!DOCTYPE html>
<html lang="en">
  
<head>
    <title>Document</title>
    <script src="jquery-3.6.0.min.js"></script>
</head>
  
<body>
    <p>GeeksforGeeks</p>
</body>
  
</html>

输出:

GeeksforGeeks

在上面的代码中，我们已经用一个

<!DOCTYPE html> <html lang="en"> <head> <title>Document</title> <script src="jquery-3.6.0.min.js"></script>  <script> $(document).ready(function () {$ ("button").click(function () { $("p").css("color", "green"); }); }); </script> <button> Change the color of the text to Green </button> </head> <body> <p>GeeksforGeeks</p> </body> </html>

如何执行jQuery代码

回顶部