jQuery复习与总结(1)
1.1 jQuery是什么?
我认为jQuery本身是一个基于JavaScript基础上封装的一个小的的类库,能够实现一些特定的功能;
-
JavaScript与jQuery的包含与被包含的关系
javascript包含jQuery,jQuery能实现的功能,使用原生JavaScript都能实现,但是JavaScript能实现的功能,jQuery不一定能实现;
使用惯了jQuery,就是感觉比写原生的爽得多,大大提高了开发效率,但万变不离其宗,只要原生的方法什么的都很清楚,你自己也可以封装一个属于你自己的类库;
jQuery中也封装了很多带有动画效果的方法,你也可以使用CSS3来实现动画效果;
1.2 jQuery的特点?
- 是一个JavaScript函数库;
- 比较轻量级;
- "写的少,做的多(write less,do more)",很爽;
- 大量的操作DOM元素;
- 兼容性,目前jQuery兼容于所有主流浏览器, 包括Internet Explorer 6;
1.3 jQuery库都有什么功能?
- HTML 元素选取
- HTML 元素操作
- CSS 操作
- HTML 事件函数
- JavaScript 特效和动画
- HTML DOM 遍历和修改
- AJAX
- Utilities
- Jquery还提供了大量的插件
1.4 jQuery的使用
-
要使用jQuery,就先引入,一般用于项目我们使用xxxx.min.js
<script src="libs/js/jquery-1.10.2.min.js"></script>
旧版本的需要在<script> 标签中加入 type="text/javascript"属性 ,在 HTML5 中,可以省略不写。因为JavaScript 是 HTML5 以及所有现代浏览器中的默认脚本语言。
-
jquery的两个版本使用场景:
- Production version - 用于实际的网站中,代码是精简和压缩的,多用于上线项目中;
- Development version - 用于测试和开发,代码没有压缩,可读性高,用于生产环境中,便于程序人员阅读和查看;
-
关于下载
-
可以上jQuery官网下载Jquery库
-
使用npm命令下载
-
npm install jquery
会自动下载安装到你的node_modules目录下,引用的话在node_modules/jquery/dist/目录下;
-
-
使用bower命令下载
-
bower install jquery
会自动下载安装到你的bower_components目录下,引用的话在bower_components/jquery/dist/目录下;
-
-
-
不下载,使用网络地址引用也可以
* 百度CDN
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>* 谷歌CDN(不稳定) <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> * 微软CDN <script src="http://ajax.htmlnetcdn.com/ajax/jQuery/jquery-1.10.2.min.js"></script>
1.5 使用CDN的好处?
- 提高加载速度;
- 利于优化;
- 也是前端页面性能优化的一个重要途径;
- 原理:
许多用户在访问其他站点时,已经从百度、又拍云、新浪、谷歌或微软加载过 jQuery。所以当用户访问您的站点时,会从缓存中加载 jQuery,这样可以减少加载时间。同时,大多数 CDN 都可以确保当用户向其请求文件时,会从离用户最近的服务器上返回响应,这样也可以提高加载速度。
举个栗子吧:
- 比如我们使用迅雷下载资源的时候,迅雷首先会发现周围哟没有用户下载过这个资源,如果其他用户下载过,就会利用这个缓存渠道直接下载,这也是为什么你会感觉到有的时候下载速度明显很快,有时候却很慢,其实原理都差不多;
++++++++++++++++++++++++++++++++++++++++++++++++++++++
-----时光不散,青春不老---
-------呆萌小二郎zmh'
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++