jQuery的简单使用

网页中添加 jQuery

可以通过多种方法在网页中添加 jQuery。 您可以使用以下方法:

  • 从 jquery.com 下载 jQuery 库

  • 从 CDN 中载入 jQuery, 如从 Google 中加载 jQuery


下载 jQuery

有两个版本的 jQuery 可供下载:

  • Production version - 用于实际的网站中,已被精简和压缩。

  • Development version - 用于测试和开发(未压缩,是可读的代码)

以上两个版本都可以从 jquery.com 中下载。

jQuery 库是一个 JavaScript 文件,您可以使用 HTML 的 <script> 标签引用它:

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

注: 将下载的文件放在网页的同一目录下,就可以使用jQuery。


替代方案

如果您不希望下载并存放 jQuery,那么也可以通过 CDN(内容分发网络) 引用它。

百度、又拍云、新浪、谷歌和微软的服务器都存有 jQuery 。

如果你的站点用户是国内的,建议使用百度、又拍云、新浪等国内CDN地址,如果你站点用户是国外的可以使用谷歌和微软。

注:本站实例均采用百度 jQuery CDN库。

<head>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
</head>

实例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
 <script>
 $(document).ready(function(){
 $("#hide").click(function(){
 $("p").hide();
 });
 $("#show").click(function(){
 $("p").show();
 });
 });
 </script>
</head>
<body>
 <p>欢迎大家来到php.cn</p>
 <button id="hide">隐藏</button>
 <button id="show">显示</button>
</body>
</html>
继续学习
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php.cn</title> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#hide").click(function(){ $("p").hide(); }); $("#show").click(function(){ $("p").show(); }); }); </script> </head> <body> <p>欢迎大家来到php.cn</p> <button id="hide">隐藏</button> <button id="show">显示</button> </body> </html>
提交重置代码