1、JQuery 名称解释

JQuery是封装了常用JS操作函数的一个库文件

JQuery = Javascript + Query (查询)

Jquery意思即指: 强大的DOM节点查询

 

2、官网:http://jquery.com/

JQuery2.*不再支持IE6、7、8，上线环境使用压缩版可以省带宽

 

3、基本选择器

同CSS选择器

     
      id test1
     
     
      class test2
     
     
      class test2
     
p1
p2
p3

 

 

4、层次选择器

12
34
56
     
      7
     

 

 

5、属性选择器

Email:
密码:
重复密码:
学号:
学分:

 

 

6、基础过滤器(配合选择器使用)

     
      
导航1
      
导航2
      
导航3
      
导航4
      
导航5
      
导航6
     

 

 

7、内容过滤器

     
      
       
        
姓名
        
性别
        
年龄
       
       
        
张飞
        
男
        
26
       
       
        
孙尚香
        
女
        
23
       
       
        
赵云
        
男
        
24
       
       
        
花木兰
        
        
22
       
      
     
a

 

 

前面介绍的都是找对象的方法，接下来我们来操作对象

8、操作普通属性

attr一个参数是获取属性，两个参数是赋值

 

 

9、操作css属性

css()传一个值是获取属性值，传两个是赋值

因为width和height操作频繁，jquery给我们封装了width()和height()方法直接获取宽高

jQuery操作CSS属性
     
      点击宽高+10px
     

 

 

10、删除节点（remove）

       增加节点(append)

       a.after(b)  在a后增加b

       a.before(b)在a前面加b

     
      
导航1
      
导航2
      
导航3
      
导航4
     

 

 

11、节点包裹

jQuery包结点
     
      
春
      
夏
      
秋
      
冬
     

 

 

12、jquery对象与DOM对象的关系

jQuery对象与DOM对象的关系
     
      
导航1
      
导航2
      
导航3
      
导航4
     
test

 

13、jquery动画

2秒消失的div

向上收起的广告图

图片淡入淡出

 

 

14、ajax之get请求

用户名: 

 

 

15、ajax之post请求

jquery 发送POST ajax查询
     
      
用户名:
      
密码:
      
     

 

 

16、ajax监听函数

ajax提交时让提交按钮变得不能点并显示“提交中”

ajaxStart()、ajaxSuccess()这几个函数,只能绑定$(document)结点上

$.ajax()
     
      
     

 

 

17、jquery对象的遍历

全选、全不选与反选

对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。

对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。

遍历jQuery对象的内部的DOM对象
选择1:
选择1:
选择1:
选择1:
选择1:

 

 

18、jquery处理事件的特点

1:和原生事件的语法区别

原生绑定: xxDOMNode.οnclick=function(){} , xx.onmousever = function();

原生触发: xxDOMNode.click(), xx.submit(); xx.focus();

jQuery绑定: $(selector).click(function(){});

jQuery触发: $(selector).click();

2:和xx.onclick等的绑定次数的区别

xx.onclick = function(){},是给onclick属性赋值,赋多个值,前面的被覆盖,只有最后一个函数被调用

$(selector).click(函数1);

$(selector).click(函数2);

$(selector).click(函数3); // 会按绑定的顺序,逐个执行

 

 

19、ready事件

dom加载完毕就会执行，而window.onload需要等待整个页面加载完毕

onload事件

 

 

20、一次绑定

只会执行一次