jquery怎么使用

jquery的使用方法：首先通过CDN加载或本地加载文件的方式来加载jquery文件；然后通过jquery文件来执行jQuery代码即可。

本文操作环境：Windows7系统、Dell G3电脑、jquery3.2.1版。

怎么使用jquery？本篇文章给大家介绍什么是jquery？为什么使用jquery？如何使用jquery？让大家了解jquery的使用方法，希望对你们有所帮助。

什么是jQuery？

jQuery不是一种语言，但它是一个编写良好的JavaScript代码，它是一个快速而简洁的JavaScript库，简化了HTML文档遍历，事件处理，动画和Ajax交互，以实现快速Web开发。

为什么选择jQuery？

jQuery是一个非常紧凑且编写良好的JavaScript代码，它通过编写非常少量的代码使它们能够实现关键的UI功能，从而提高了开发人员的工作效率。

jQuery的优点是：

1、无需学习使用jQuery的全新语法，了解简单的JavaScript语法就足够了。

2、代码简单明了，无需编写多行代码即可实现复杂功能。

3、有助于提高应用程序的性能。

4、它有助于开发大多数浏览器兼容的网页。

5、它有助于实现与UI相关的关键功能，而无需编写数百行代码。

怎么使用jQuery？

1、加载jQuery文件

jQuery通常作为单个JavaScript文件出现，其中包含jQuery开箱即用的所有内容。它可以使用以下方式包含在网页中：

1）、加载本地jQuery文件

首先需要下载jQuery文件到本地，jQuery JavaScript文件可以从jQuery 官方网站下载，地址：http://www.jquery.com。

然后是加载jQuery文件

<script type="text/javascript" src="jQuery-1.4.1-min.js"></script>

2）、从CDN加载jQuery

什么是CDN？

CDN代表Content Distribution Network，也称为Content Delivery Network是一组放置在与包含数据文件的副本网络中存取数据以最大化带宽连接的各个点的计算机。在CDN中，客户端访问更靠近客户端位置的数据副本，而不是从一个特定服务器访问的所有客户端。这有助于实现客户端更好的数据检索性能。

有两个主要的CDN可用于托管jQuery文件：

a、从Microsoft AJAX CDN加载jQuery

可以从Microsoft AJAX CDN加载jQuery文件。更多细节可在此处获得。您需要在页面中保留以下标记。

<script type="text/javascript" language="Javascript"  src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.1.min.js"></script>

b、从Google Libraries API加载jQuery

可以从Google CDN加载jQuery文件。您需要在页面中保留以下标记。

<script type="text/javascript" language="Javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"> </script>

从CDN加载jQuery的好处：

1、由于无需下载jQuery文件，因此页面加载速度更快

2、由于未从服务器加载jQuery文件，因此节省了带宽

3、可扩展 ，通常CDN将这些文件放在位于世界不同地理位置的服务器上，以便加载速度更快，因此无论用户在何处浏览页面，您的应用程序都可以正常运行。

注：

一般情况下从CDN加载jQuery和从本地加载jQuery文件，这两种方法都要写上，防止用于加载jQuery文件的CDN不可用。因此，可以写下以下代码行：

<!-- START - jQuery Reference -->
<script type="text/javascript" language="Javascript" 

    src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.1.min.js"></script>
    <script type=&#39;text/javascript&#39;>//<![CDATA[
        if (typeof jQuery == &#39;undefined&#39;) {
            document.write(unescape("%3Cscript 
    src=&#39;/Script/jquery-1.4.1.min.js&#39; type=&#39;text/javascript&#39; %3E%3C/script%3E"));
}//]]>
</script>
<!-- END - jQuery Reference -->

2、执行jQuery代码

我们可能有两种方法来执行jQuery代码。

1、当页面加载时，执行jQuery代码：

<script language="javascript" type="text/javascript">
$(function () {
$("#div1").css("border", "2px solid green");
});
</script>

或者：

<script language="javascript" type="text/javascript">
$("#div1").css("border", "2px solid green");
</script>

以这种方式执行jQuery代码的好处是它不会等待整个页面完全加载，因此如果您希望用户在加载相应元素后立即查看效果，您可以使用它。

但缺点是如果jQuery必须执行的元素没有加载，那么它将会出错或者你不会得到所需的结果; 因此，在使用这种执行jQuery代码的方式时，您必须确保首先加载要使用jQuery的元素（您可以将jQuery代码放在HTML元素之后）。

2、仅在完整的DOM对象（已加载完整页面）时执行jQuery。此时必须将代码包装在.ready函数中。

<script language="javascript" type="text/javascript">
$(document).ready(function () {
$("#div1").css("border", "2px solid green");
});
</script>

这是执行jQuery的更好，更安全的方法。这样可以确保只有在浏览器中加载完整页面时才会执行jQuery代码，因此可以放心，用户不会在页面上看到任何不需要的行为。

总结：以上就是本篇文章的全部内容，希望能对大家的学习有所帮助。

以上是jquery怎么使用的详细内容。更多信息请关注PHP中文网其他相关文章！