、jquery的介绍
1.jQuery是一个优秀的javaSript的框架，一个轻量级的js库
2.他封装了js，css，dom，童工了一致的，简介的API
3.兼容css3以及各种浏览器
4，是用户更加方便的处理HTML。EVENTS，实现动画的效果，并且方便的为网站提供AJAX交互，是用户的HTML页面保持代
码和HTML内容分离
注：jQuery2.x开始不在支持Internet Exeplorer 6，7，8
总结：jQuery是一个优秀的javaScript框架，一个轻量级的JS库。它里面封装了很多的js，css，dom相关的操作。我们使用
jQuery，能够简介的书写前端的代码，并且它能够兼容大多数的浏览器，对我们的ajax的操作也提供了简介的解决方案。在页面
使用jQuery，可以“少写，多做”，提高我们的开发效率
二、如何使用jQuery
1，引入jQuery的js文件
2，利用选择器，查找操作的节点进行更简洁的
3,
attr() val() html() text()
三、dom与jQuery对象的相互转换
a dom----》jQuery对象
$(dom)
b jQuery--->dom
$obj.get(0)
或
$obj.get()[0];
四 选择器
a 基本选择器 demo1.html
#id id选择器
element 元素选择器
.class 类选择器
* 通配符
selector1，selector2，selectorN 合并选择器
b，层级选择器 demo2.html
ancestor descendant 通过当前节点查找所有的后代
parent > child通过当前节点查找素有的子节点
prev+ next查找当前节点下一个兄弟
prev~ nextborther 查找当前节点下所有的兄弟节点
c,借本过滤选择器 demo3.html
：first 查找第一个
：last 查找催后一个元素
：not(selector)排除满足要求的节点对象
：even 查找偶数项的节点对象
：odd 查找及奇数项的节点对象
：eq（index） 查找下标等于xx的节点对象
：gt（index） 查找下标大于xx的节点对象
：lt（index）查找下表小于xx的节点对象
d:内容过滤器 demo4.html
：contains（text）匹配包含指定文本的元素
：empty 匹配所有不包含子节点或文本的空元素
：parent 匹配所有包含子节点或文本的空元素
：has（selector） 匹配还有选择器所匹配的元素
e:可见性过滤器 demo5.html
：hidden 匹配隐藏的对象
：visible 匹配 可见的对象
f:属性 demo6.html
[attribute] 有xx属性的节点对象
[attribute=value]属性值等于xx的节点对象
[attribute！=value]属性值不等于xx的节点对象
[attribute^=value]属性值以xx开始的节点对象
[attribute$=value]属性值以xx结束的节点对象
[attribute*=value]属性值包含xx的节点对象
[attrisel1] [attrisel2] [attriselN]复合属性选择器，需要同时满足多个条件的节点对象。
g:子元素过滤器 demo7.html
：first-child 匹配所有父元素的第一个子元素
：last-child 匹配所有父元素的第一个子元素
：nth-child(index) 匹配所有父元素下第index个子元素
h 表单对象属性 demo8.html
：enabled 查找属性是启用的节点对象
：disabled 查找属性是禁用的节点对象
：checked 查找单选或复选按钮中被选中的节点对象
:selected 查找下拉选被选中的节点对象
五：jquery对DOM操作的支持
什么叫DOM？
1.浏览器首先要对一个html文档进行解析
2.在浏览器的内存中会生成一个dom树
3.浏览器会对这个dom树进行渲染并生成相应的页面效果。
a，查询或修改节点d1.html
html()
text()
val()
attr()
removeAttr()
b,创建 d2.html/dom
$('dom')
c添加
append(content|fn)作为最后一个孩子添加
appendTo(content)把所匹配的元素追加到另一个指定的节点中
prepend(content |fn)作为第一个孩子添加
prependTo（content） 把所匹配的元素前置到另一个指定的节点中
插入
after(content|fn)作为下一个兄弟添加
before(content|fn)作为上一个兄弟添加
d清空
empty()清空
remove() 删除
e页面载入
$(this)代表当前的节点
$(document).ready(function (){
});
简写方式：
$(function(){
});
f.复制一个节点clone(boolean)
true将此节点绑定的事件一块复制过去
1.5以后的版本默认为false。
g.样式
addClass();里面可以传class的名字或者一个函数
removeClass();
toggleClass();
事件处理
事件：js使我们有能力动态的去构建页面，事件就是可以被js侦测到的行为，简单来说就是计算机与
人之间的交互行为。
事件对象（event）：我们每一次执行事件是，都会产生一个事件对象，该对象中包含了事件的相关
信息，比如导致事件产生的元素（事件源），事件的类型以及其他特定事件的相关信息。
1.原生js事件的回顾
a，原生js如何绑定事件处理函数
a-1 <input onclick="">绑定到html元素上
a-2 obj.onclick=function(){}动态绑定在节点对象上
a-3使用浏览器内置的特殊对象进行绑定。（了解）
b,事件源，产生当前事件的源头;event,内置的对象
event.target
<input type="text" onclick="test1()"/>
c.获取鼠标点击的坐标位置：
event.clientX/offsetX
event.clientY/offsetY
d，阻止事件冒泡
event.stopPropagation()
或
event.cancelBubble=true;
2.jQuery对事件的支持
a，jQuery如何绑定事件处理函数？在jQuery的函数里面要用event，必须传参数event
比如：funtion test(event){
event.target.nodeName}
1正式写法
on(event,[selector],[data],fn)
event:表示所要绑定的事件类型，用逗号隔开,比如：'click,blur'
selector:匹配后代，可以共同使用该函数比如'.s1,.s2'
data:当事件被触发时，要传递event,data给事件处理函数
fn：即所要执行的函数，可以简写一个false，即该函数的返回值为false
2.简写d2.html
click([data],fn)
change([data],fn)
blur([data],fn)
b如何获取事件对象
funtion(event){
}
c jQuery事件对象的作用
c.1找到事件源？（事件源：事件的源头）event
var obj=event.target
c.2获取鼠标的坐标位置
event.pageX
event.pageY
c.3取消事件冒泡
event.stopPropagation()
b 如何获取事件对象？
$(obj).click(function(event){
})
c jQuery事件对象的作用
c.1 找到事件源 ？（事件源：事件的产生源头） event/e4.html
//在此处返回的是一个dom节点对象
var obj = event.target
c.2 获取鼠标坐标位置
event.pageX
event.pageY
c.3 取消事件冒泡
event.stopPropagation()
d 事件切换
hover([over,]out) :一个模仿悬停事件的方法 event/e5.html
over:鼠标移到元素上要触发的函数
out:鼠标移出元素要触发的函数
toggle([spe],[eas],[fn])1.9* event/e6.html
用于绑定两个或多个事件处理器函数，以响应被选元素的轮流的 click 事件。
如果元素是可见的，切换为隐藏的；如果元素是隐藏的，切换为可见的。
e 模拟事件
trigger()
七。动画效果
a.显示，隐藏
show([s],[e],[fn])显示，display结果为block
hide()([s],[e],[fn])隐藏，display结果为none
toggle()([s],[e],[fn])显示和隐藏之间的来回切话
b.滑动
slideUp()([s],[e],[fn])
slideDown()([s],[e],[fn])
slideToggle()([s],[e],[fn])
c.淡入/淡出
fadeIn();([s],[e],[fn])
fadeOut()([s],[e],[fn])
fadeTo()([s],[o],[e],[fn])
fadeToggle()([s],[e],[fn])
其中[s]为时间，单位为毫秒
[o]为透明度
[e]默认为swing，可用参数为liner
[fn]在动画完成时所执行的函数，每个元素执行一次
h查找
注：table表格里面的的tr默认加在tbody里面
children()查找所有的子节点
find(e|o|e)查找满足条件的后代，必须要有参数
next()查找下一个兄弟。
nextAll()查找下面所有的兄弟
nextUtil(exp)查找下面所有的兄弟，到exp停下来
offsetParent()返回第一个匹配元素用于定位的父节点。
parents()找到自己所有的祖先元素
parent()找到自己的父亲节点
prev()该集合每一个元素的查找上一个兄弟
prevAll()该元素上面所有的兄弟
prevUntil(exp)查找上面所有的兄弟，到exp条件停下来
sibilngs()除了自己找到其他所有的兄弟，可以筛选
jQuery对ajax的支持
1.load(url,[data],[callback])
作用：向服务器发送异步请求，将服务端相应回来的数据直接添加在符合要求的节点之上。
参数
url：请求地址
data：请求参数，有两种形式
‘’name=tom&age=23‘
或
{"name":'tom',"age":23}
如果有请求参数，则发送的请求是post请求，如果没有请求，参数则发送的是get请i去
callback：载入成功是的回调函数
弊端：只能发送异步请求，对返回的数据不能处理
只能添加在符合要求的节点之上。
2 $.get(url,[data],[fn],[type])
$post(url,[data],[fn],[type])
弊端：只能发送异步请求，不能发送同步请求
3 $.ajax({json对象})
a 作用： 可以向服务端异步或同步的发送请求，并且可以使用回调函数处理
服务端响应回来的内容。
b 用法 :$.ajax({json对象})，按照json语法去定义参数。
注 ： json对象参数有以下主要可选项
url:请求地址
type：请求方式（get/post）
data：绑定向服务端传递的参数
dataType：服务端响应回来的数据类型（有五种，参照上的$.get）
success:ajax请求成功时执行的回调函数
函数格式:function(resutlt[,status]){
}
error：ajax请求失败时执行的回调函数
async:默认缺省值为true . true表示异步，false表示同步
例如:
$.ajax({
'url': 'checkName.do',
'type':'get',
'data':'username='+name/{'username':name},
'dataType':'text',
'success':function(data){
},
'async':false
})