温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

怎么使用jquery

发布时间:2020-07-10 15:00:45 来源:亿速云 阅读:162 作者:Leah 栏目:web开发

怎么使用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='text/javascript'>//<![CDATA[
        if (typeof jQuery == 'undefined') {
            document.write(unescape("%3Cscript 
    src='/Script/jquery-1.4.1.min.js' type='text/javascript' %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问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注亿速云行业资讯频道了解更多相关知识。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI