初始jQuery

1what

http://jquery.com/

* 一个优秀的JS函数库: write less, do more(使用了jQuery的网站超过90%,中大型WEB项目开发首选)

* 封装简化DOM操作(CRUD) / Ajax

2why

* 强大选择器: 方便快速查找DOM元素(HTML元素选取和操作)

* 隐式遍历(迭代): 一次操作多个元素

* 读写合一: 读数据/写数据用的是一个函数(一般传参数就是写,不传就是读)

* 链式调用: 可以通过.不断调用jQuery对象的方法

* HTML事件处理(响应用户操作)

* DOM操作(CUD)

* 样式(CSS)操作

* JS动画效果

* 浏览器兼容

* 易扩展插件

* ajax封装

3how

3.1 引入jQuery库

1)本地引入

<script type="text/javascript" src="js/jquery-1.12.3.js"></script>

2)CDN远程引入(需要有网)

<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.js"></script>

https://cdn.bootcss.com/jquery/1.9.0/jquery.min.js

https://cdn.bootcss.com/jquery/1.9.0/jquery.js

3.2使用jQuery

* 使用jQuery函数: $/jQuery

* 使用jQuery对象: $xxx(执行$()返回的)

//绑定文档加载完成的监听
jQuery(function () {
  var $btn2 = $('#btn2')
  $btn2.click(function () { // 给btn2绑定点击监听
   
var username = $('#username').val()
    alert(username)
  })
})

3.3区别

1)区别两种JS库库文件

 *测试版与生产版(压缩版min)

开发阶段用未压缩的测试版,上线发布的时候用压缩版

2)区别两种引用JS库的方式

 服务器本地库:开发测试时使用,加重了服务器负担, 上线时一般不使用这种方式

 CDN远程库:项目上线时, 一般使用比较靠谱的CDN资源库,,减轻服务器负担

3)区别jQuery的不同版本

1.x:兼容老版本IE,文件更大

2.x:部分IE8及以下不支持,文件小, 执行效率更高

3.x:完全不再支持IE8及以下版本,提供了一些新的API,提供不包含ajax/动画API的版本

 

posted @ 2019-10-29 13:01  阿江是个程序猿  阅读(125)  评论(0编辑  收藏  举报