一定义
是一个是免费、开源的javascript库
二作用
方便的完成web前端的相关操作,例如节点操作,元素操作,事件绑定,ajax操作, 且解决了大多数的兼容性问题
三使用
1配置
 01本地配置
       1.下载jquery文件   www.jquery.com
       2.<script type="text/javascript" src="jquery.js"></script>
02访问远程文件
       <script src="http://www.xiaohigh.com/jquery.js"></script>
03检测配置
       alert($)   $是jquery对象的简写
       alert(jQuery)
2应用
01查找元素
   (1)基本获取
       通过id查找元素  $('#id')
       通过标签名或者元素  $('div')
       通过class属性获取 $('.class')
       逗号并列获取  $('#id,.class')
       空格层级获取  $('#id .class')
   (2)过滤获取
       获取第一个元素  $('li:first')
       获取最后一个元素 $('li:last')
       获取指定索引的元素  $('li:eq(5)')   $('li').eq(5)
       获取包含指定文本的元素 $('li:contains("国")')
       通过属性查找元素 
       $('input[name=username]')  通过单个属性名和属性值查找
       $('input[type=text][name=phone]')   通过多个属性名和属性值查找
   (3)父子节点获取
       获取所有的子元素  $('ul').children()
       获取第一个子元素  $('ul li:first-child')
       获取最后一个子元素  $('ul li:last-child')
       获取指定顺序第几个元素   $('ul li:nth-child(1)')  
       获取下一个元素  $('#id').next()
       获取上一个元素  $('#id').prev()
       获取父级元素  $('#id').parent()
       获取先辈元素  $('#id').parents('tr')
       获取同辈元素  $('#id').siblings()
       在父级元素中查找元素   $('ul').find('.class')
02元素的操作
       属性操作
          attr();
          removeAttr();
       样式操作
          css();
          addclass();
          removeClass();
 文本操作
          text();
          html();
       form元素值的操作
          值的获取和设置
              获取  $(element).val()  
              设置   $(element).val('厉害了 word哥')   
       其他       
          获取相对于文档的偏移量
                 offset()
          获取元素相对于父级的偏移量
                 position()
          获取或设置滚动条的位置
                 scrollLeft()
                 scrollTop()
          宽度和高度
             width
                 获取可视区域的宽度     $(window).width()
               获取整个文当的宽度     $('document').width()
            height
               获取可视区域的高度     $(window).height()
               获取整个文档的高度     $(document).height()      
03节点操作
          创建元素节点
             $('<div></div>')
             $('<div class='cur'><span>hello world</span></div>')
          插入节点
                 内部尾部添加
                        $(parent).append(newNode)
                        newNode.appendTo(parent)
                 内部头部添加
                        $(parent).prepend(newNode)
                        $(newNode).prependTo(parent)
                 元素外部之后添加
                        $(element).after(newNode)
                        newNode.insertAfter(element)
                 元素外部之前添加
                        $(element).before(newNode)
                        newNode.insertBefore(element)
          删除节点
                 $(element).remove()  删除当前节点
                 $(element).empty()  清空节点
          替换节点
                 $(element).replaceWith(newNode)
          克隆节点
                 $(element).clone(true)
          包裹元素
                 $(element).wrap('<div></div>')   当前的元素被其他的元素包裹
                 $(element).unwrap()   解除包裹     

04事件
          事件绑定
                      基本绑定
                                   $(element).click(function(){})
                           $(element).dblclick(function(){})
                                   ..........................
                                   加载完毕事件
                                                $(document).ready(function(){})
                                                $(function(){})
                      方法绑定
                                   $(element).bind('click',function(){})
                                   $(element).unbind()
                                   $(element).on('click', function(){})                           
                      动态绑定
                                   $(element).live('click', function(){})
             事件触发
                      $(element).trigger('click')
             阻止事件冒泡和默认行为
                      return false
             获取当前鼠标坐标的位置
                          $(element).click(function(e){
                               var cx = e.clientX
                               var cy = e.clientY
                               var px = e.pageX
                               var py = e.pageY
                          })
05ajax
          $.get('1.php',{a=100&b=200},function(data){})
             $.post('1.php',{num=10$id=10},function(data){})
             $.ajax({
                              url: '1.php',   url请求的脚本
                              data: 'id=100&page=10',    data发送的数据
                              dataType: 'json',    dataType数据的类型
                              type: 'GET',    type请求的类型  get或post
                              success: function(data){},    success成功的执行代码
                              error: function(){},         error失败的执行代码
                              timeout:3000,     timeout 超时时间
                              async: false    async是否异步
                          })
06特效
          快速显示和隐藏
                      $(element).hide()
                      $(element).show()
             滚动显示和隐藏
                      $(element).slideDown()
                      $(element).slideUp()
             渐隐渐显
                      $(element).fadeIn()  显
                      $(element).fadeOut() 隐
             自定义动画
                      $(element).animate({},2000)
             停止
                      $(element).stop()
             延时
                      $(element).delay(2000)