jQuery课程介绍

什么是jQuery

jQuery是一套Javascript脚本库. 在我的博客中可以找到"Javascript轻量级脚本库"系列文章. Javascript脚本库类似于.NET的类库, 我们将一些工具方法或对象方法封装在类库中, 方便用户使用.

注意jQuery是脚本库, 而不是脚本框架. "库"不等于"框架", 比如"System程序集"是类库,而"ASP.NET MVC"是框架. jQuery并不能帮助我们解决脚本的引用管理和功能管理,这些都是脚本框架要做的事.

脚本库能够帮助我们完成编码逻辑,实现业务功能. 使用jQuery将极大的提高编写javascript代码的效率, 让写出来的代码更加优雅, 更加健壮. 同时网络上丰富的jQuery插件也让我们的工作变成了"有了jQuery,天天喝茶水"--因为我们已经站在巨人的肩膀上了.

创建一个ASP.NET MVC项目时, 会发现已经自动引入了jQuery类库. jQuery几乎是微软的御用脚本库了!完美的集成度和智能感知的支持,让.NET和jQuery天衣无缝结合在一起!所以用.NET就要选用jQuery而非Dojo,ExtJS等.

1）jQuery 是一套Javascript脚本库，注意 jQuery 是脚本库,而不是脚本框架。"库"不等于"框架"。jQuery 并不能帮助我们解决脚本的引用管理和功能管理,这些都是脚本框架要做的事。

脚本库能够帮助我们完成编码逻辑,实现业务功能。使用 jQuery 将极大的提高编写javascript代码的效率, 让写出来的代码更加优雅, 更加健壮。

2）使用这些功能函数,能够帮助我们快速完成各种功能,而且会让我们的代码异常简洁。

3）javascript脚本在不同浏览器的兼容性一直是 Web 开发人员的噩梦，比如在 jQuery 中的 Event 事件对象已经被格式化成所有浏览器通用的,从前要根据event获取事件触发者, 在 ie 下是event.srcElements 而 ff 等标准浏览器下是event.target。 jQuery 则通过统一event对象,让我们可以在所有浏览器中使用event.target获取事件对象。

4）jQuery 可以实现比如渐变弹出,图层移动等动画效果,让我们获得更好的用户体验。

5）大部分开发人员对于javascript存在错误的认识，比如在页面中编写加载时即执行的操作 DOM 的语句,在 HTML 元素或者document对象上直接添加onclick属性,不知道onclick其实是一个匿名函数等等。这样的程序是不健壮的。比如"在页面中编写加载时即执行的操作 DOM 的语句",当页面代码很小用户加载很快时没有问题, 当页面加载稍慢时就会出现浏览器"终止操作"的错误。

新建文件

<!doctype html>
<html lang="zh">
<head>
 <meta charset="utf-8"/>
 <title>Hello World jQuery!</title>
 <script src="jquery-3.1.1.min.js"></script>
</head>
<body>
<div id="divMsg">Hello jQuery!</div>
<input id="btnShow" type="button" value="show" />
<input id="btnHide" type="button" value="hidden" /><br/>
<input id="btnChange" type="button" value="change content is Hello World, too!"/>
<script>
 $("#btnShow").bind("click", function(event) {
 $("#divMsg").show();
 });

 $("#btnHide").bind("click", function(event) {
 $("#divMsg").hide();
 });

 $("#btnChange").bind("click", function(event) {
 $("#divMsg").html("Hello World, too!");
 });
</script>
</body>
</html>

提交重置代码

自动运行

全屏