1. 认识jQuery
    1. 库的概念
      1. javascript
      2. javascript库
        1. prototype
        2. dojo
        3. YUI(yahoo UI)
        4. Ext JS
        5. Moo Tools
        6. jQuery
          1. 强大的选择器
          2. 出色的DOM操作
          3. 可靠的事件处理
          4. 完善的兼容性
          5. 链式操作
    2. 加入jQuery
      1. 轻量级
      2. 强大的选择器
      3. 出色的dom操作
      4. 可靠的事件处理机制
      5. 完善的Ajax
      6. 不污染顶级变量
      7. 出色的浏览器兼容性
      8. 链式操作方式
      9. 隐式迭代
      10. 行为层与结构层的分离
      11. 丰富的插件支持
      12. 完善的文档
      13. 开源免费
    3. jQuery代码的编写
      1. jQuery库
        1. 生产版
        2. 开发板
      2. $(document).ready(匿名函数动作)
    4. DOM对象和jQuery对象
      1. DOM对象
        1. DOM对象转jQuery对象
      2. jQuery对象
        1. $('#id').html()
        2. jQuery对象转DOM对象
      3. 判断对象是否用选用(表单的label标签,id=cr)
        1. DOM方法
        2. jQuery方法
    5. 解决jQuery与其他库冲突问题
      1. jQuery在其他库之前引入
      2. jQuery在其他库之后引入
        1. 控制权交出后用jQuery开头调用,里面可以继续用$
        2. 定义匿名函数参数为$里面再用$()方法
    6. jQuery开发工具和插件
      1. dreamweaver
      2. aptana
      3. jQueryWTP和Spket插件
      4. visual Studio 2008
      5. 其他工具
  2. jQuery选择器
    1. CSS选择器
      1. 标签选择器
      2. ID选择器
      3. 类选择器
      4. 群组选择器
      5. 后代选择器
      6. 通配符选择器
      7. 伪类选择器
      8. 子选择器E>F
      9. 临近选择器E+F
      10. 属性选择器E[attr]
      11. 个别浏览器不支持
    2. jquery选择器
      1. 基本选择器
        1. $("#test")
        2. $(".class")
        3. $("p")
        4. $(*)
        5. $("div,span,p.myclass")
      2. 层次选择器
        1. $("div span")后代span
        2. $("div>span")子元素span
        3. $(".one+div")或$("one").next("div")方法
        4. $("#two~div")或$("two").nextAll("div")方法
        5. siblings()方法与上一个类似
      3. 过滤选择器
        1. 基本过滤
          1. $("div:first")
          2. $("div:last")
          3. $("input:not(.myclass)")
          4. $("input:even")
          5. $("input:odd")
          6. $("input:eq(1)")
          7. $("input:gt(1)")
          8. $("input:lt(1)")
          9. $(":header")
          10. $("div:animated")
          11. $(":focus")
        2. 内容过滤
          1. $("div:contains('我')")
          2. $("div:empty")
          3. $("div:has(p)")
          4. $("div:parent")
        3. 可见性过滤
          1. $(":hidden")
          2. $(":visible")
        4. 属性过滤
          1. $("div[id]")
          2. $("div[title=test]")
          3. $("div[title!=test]")
          4. $("div[title^=test]")
          5. $("div[title$=test]")
          6. $("div[title*=test]")
          7. $("div[title|=test]")
          8. $("div[title~=test]")
          9. $("div[id][title$=test]")
        5. 子元素过滤
          1. :nth-child(index/even/odd/equation)
          2. $("ul li:first-child")
          3. $("ul li:last-child")
          4. $("ul li:only-child")
          5. 子主题 3
        6. 表单对象属性过滤
          1. $("#form1 :enabled")
          2. $("#form1 :disabled")
          3. $("input:checked")
          4. $("select option:selected")
      4. 表单选择器
        1. $(":input")
        2. $(":text")
        3. $(":password")
        4. $(":radio")
        5. $(":checkbox")
        6. $(":submit")
        7. $(":image")
        8. $(":reset")
        9. $(":button")
        10. $(":file")
        11. $(":hidden")
      5. 注意事项
        1. 选择器里含有.#$([]等符号问题
        2. 属性选择器@符号问题
        3. 选择器中含有空格$('div :hidden')
      6. 介绍的jquery方法
        1. $对象.show()
        2. hide()
        3. css('属性','属性值')
        4. text("文本内容")
        5. filter(表达式1,表达式2....)
        6. find("span")
        7. addClass('class')
        8. removeClass("class")
        9. is(":hidden")
        10. toggle(真动作语句,假动作语句)
      7. 其他选择器
        1. moreselectors for jquery
        2. basic XPath
        3. 其他使用css选择器方法
          1. document.getelementsbyselector()
          2. cssQuery()
          3. querySelectorAll()
  3. jQuery的DOM操作
    1. dom操作分类
      1. DOM Core
      2. HTML-DOM
      3. CSS-DOM
    2. jquery中的dom操作
      1. 查找节点
        1. $("ul li:eq(1)")
        2. $("p").text()
        3. $('p').attr('title')
        4. $('html')
        5. var $a=$('<li></li>')
        6. $('ul').append($a)
      2. 插入节点
        1. $('p').append('你好')
        2. $('你好').appendTo('p')
        3. $('p').prepend('你好')
        4. $('你好').prependTo('p')
        5. $('p').after('你好')
        6. $('你好').insertAfter('p')
      3. 删除节点
        1. remove()
        2. detach()
        3. empty()
      4. 复制节点
      5. 替换节点
        1. replaceWith()
        2. replaceAll()
      6. 包裹节点
        1. wrap('标签')
        2. wrapAll()
        3. wrapInner('<b></b>')
      7. 属性操作
        1. attr()
        2. removeAttr()
      8. 样式操作
        1. 获取p标签class样式
        2. 设置p标签class样式为high
        3. 追加p标签class样式high2
        4. 移除p标签class样式high2
        5. 切换样式
          1. toggle()之前介绍的方法
          2. toggleClass()
        6. 判断是否含有某个样式
          1. 等价is(".class")
      9. 设置获取HTML.文本和值
        1. $('p').html()方法
        2. $('p').text()方法
        3. $('input').val()方法
        4. $(p).focus()方法
        5. $(p).blur()方法
      10. 遍历节点
        1. children('p')
        2. next('p')
        3. prev('p')
        4. siblings('p')
        5. closest('p')
        6. parent()parents()区别
          1. parent(p)
          2. parents(p)
    3. CSS-DOM操作
      1. $('p').css('color'.'red')
      2. $('p').height()
      3. $('p').offset()
      4. $('p').position()
      5. $('p').scrollTop()
      6. $('p').scrollLeft()
  4. jQuery中的事件和动画
    1. jQuery中的事件
      1. 加载DOM
        1. window.onload
        2. $(document).ready()
          1. 执行时机
          2. 多次使用
          3. 简写成$().ready()或$()
      2. 绑定事件bind或事件函数
        1. 事件绑定bind(事件,函数)方法
        2. 简写绑定事件
      3. 合成事件
        1. hover()方法
        2. toggle(函数1,函数2,函数3....)方法
          1. 作为定义函数定义鼠标单击执行相应的状态
          2. 切换元素的可见状态
      4. 事件冒泡
        1. 事件对象
        2. 停止事件冒泡
        3. 阻止元素的默认行为(提交表单)
        4. return false
      5. 事件对象的属性
        1. event.type
        2. event.preventDefault()方法
        3. event.stopPropagation()方法
        4. event.target
        5. event.relatedTarget
        6. event.pageX和event.pageY
        7. event.which
        8. event.metaKey
      6. 移除绑定事件unbind函数
        1. 移除按钮以前注册的事件
        2. 移除其中一个事件
      7. 模拟操作
        1. 常用模拟
          1. $('#btn').trigger('click')
          2. $('#btn').click();
        2. 触发自定义事件
          1. 先为元素绑定一个diy名字的事件
          2. 再用trigger模拟触发事件
        3. 传递数据
          1. 先为元素绑定一个diy名字的事件并在函数上加参数
          2. 再用trigger模拟触发事件
        4. 执行默认操作
          1. trigger()方法触发事件并执行浏览器默认操作
          2. 指向触发绑定的focus事件对应函数不想执行默认操作得到焦点
      8. bind高级其他用法
        1. 绑定多个事件类型
        2. 添加事件命名空间.便于管理
        3. 相同事件名称有不同命名空间的执行方法
    2. jQuery中的动画
      1. show()和hide()方法
        1. show()显示元素
          1. 让元素动起来加参数
        2. hide()隐藏元素
          1. 让元素动起来加参数
      2. fadeIn方法和fadeOut()方法
        1. fadeIn()按不透明度显示元素
        2. fadeOut()按不透明度隐藏元素
      3. slideUp()和slideDown()方法
        1. slideUp()只改变元素高度收缩隐藏
        2. slideDown()只改变元素高度展开显示
      4. animate()自定义动画函数
        1. 写在备注里了
        2. 停止动画和判断是否处于动画状态
          1. 停止动画stop(布尔值1.布尔值2)
          2. 判断是否在动画状态is(":animated")
          3. 延迟动画delay(时间)
      5. 其他动画方法
        1. toggle(时间.回调函数)
        2. slideToggle(时间)
        3. fadeToggle(时间)
        4. fadeTo(时间)
      6. 动画方法概括
        1. 上面所有的函数都可以用animate来代替
        2. 动画队列
          1. 一组元素的动画效果
          2. 多组元素的动画效果
    3. 视频展示效果实例
      1. find("div.mabt")
      2. $(#mabt).width();
      3. $('#mabt').length
      4. Math.ceil('6.2')
      5. eq()等于
      6. siblings()
      7. $('.mabt').is(":animated")
      8. js中"+"号是连字符
      9. javascript中的动画效果跟CSS密不可分
  5. jQuery对表单表格的操作
    1. 表单应用
      1. 单行文本框应用
      2. 多行文本框应用
        1. 高度变化
        2. 滚动条高度变化scrollTop
      3. 复选框应用
      4. 下拉框应用
        1. $('.mabt').appendTo('#mmm')
        2. $('.mabt').db1click()
        3. $("option:selected",this)
      5. 表单验证
        1. 先blur元素失去焦点就判断数据合法性
        2. 再判断是用户名还是电话还是邮箱等等
        3. keyup事件
        4. focus事件
    2. 表格应用
      1. 表格变色
        1. 普通的隔行变色
        2. 包含"王五"的行
        3. 单选框控制表格行高亮
          1. 先为表格行添加单击事件
          2. 然后给单击的当前行添加高亮样式
          3. end()
        4. 复选框控制表格行高亮
          1. 先判断是否选中已经高亮了
          2. 如果没有高亮
        5. 表格展开关闭
        6. 表格内容筛选
    3. 其他应用
      1. 网页字体大小
      2. 网页动态切换内容块
      3. 网页换肤
  6. jquery与Ajax的应用
    1. Ajax的优势和不足
      1. 优势
        1. 不需要插件支持
        2. 优秀的用户体验
        3. 提高web程序的性能
        4. 减轻服务器和带宽的负担
      2. 不足
        1. 浏览器对XMLHttpRequest对象支持度不够
        2. 破坏浏览器前进后退按钮
        3. 对搜索引擎支持不足
        4. 开发和调试工具的缺乏
    2. Ajax的XMLHttpRequest对象
    3. 传统javascript编写Ajax方式
      1. 定义一个函数来异步获取信息
      2. 声明一个对象var a=null确保为空
      3. 根据浏览器类型判断赋值XMLHttpRequest对象
      4. 使用open()方法初始化XMLHttpRequest对象
      5. 判断readyState状态==4
      6. a.readystatechange=定义回调函数
      7. 使用send()方法发送请求
    4. jquery中的Ajax
      1. $.ajax()
        1. 只有一个参数
          1. url类型string
          2. type类型string
          3. timeout类型number
          4. data类型Object或string
          5. dataType类型string
          6. xml
          7. html
          8. script
          9. json
          10. jsonp
          11. text
          12. beforeSend类型function
          13. complete类型function
          14. success类型function
          15. error类型function
          16. global类型boolean
        2. 相关例子等价$.get/$.getScript
      2. load()
        1. 载入html文档
        2. 筛选载入html文档
        3. 传递方式
        4. 回调参数(3个参数)
      3. $.get()
        1. 使用参数
        2. 回调函数
        3. 数据类型格式
          1. html片段
          2. xml文档
          3. json文件
          4. jsonp格式
      4. $.post()
        1. 与get方式不同之处
          1. get请求会在url中显示
          2. get方式对数据大小有限制2kb
          3. get请求数据会被浏览器缓存起来
          4. 在php调用$_GET$_POST方式不一样
      5. $.getScript()
      6. $.getJSON(json文件.回调匿名函数)
      7. $.each()遍历对象和数组
    5. 序列化元素
      1. serialize()方法
      2. serializeArray()
      3. $.param()它是serialize方法的核心
    6. jquery中的ajax全局事件
      1. $('#loading').ajaxStart(匿名函数)
      2. $('#loading').ajaxStop(匿名函数)
      3. $('#loading').ajaxComplete(callback)
      4. $('#loading').ajaxError(callback)
      5. $('#loading').ajaxSend(callback)
      6. $('#loading').ajaxSuccess(callback)
    7. 基于jquery的ajax聊天室程序
      1. 基本思想
      2. 设计数据库
      3. 服务端处理
      4. 客户端处理
        1. 提交用户聊天信息并处理服务器返回的聊天信息全部呈现出来
        2. 每隔几秒发起查询数据库然后返回最新的聊天信息
  7. jquery插件的使用和写法
    1. 常用插件介绍
      1. jquery表单验证插件Validation
      2. jquery表单插件Form
      3. 模拟窗口插件SimpleModal
      4. 管理Cookie的插件Cookie
      5. jquery UI插件
    2. 编写jquery插件
      1. jquery插件分3种
        1. 封装对象方法的插件
        2. 封装全局函数的插件
        3. 选择器插件
      2. 插件的基本要点
        1. 插件命名推荐jquery.插件名.js
        2. 所有对象方法都应附加到jquery.fn对象上
        3. 在插件内this指向选择器获取的jquery对象
        4. 可以通过this.each来遍历所有元素
        5. 所有方法函数插件都应当以分号结尾
        6. 插件应返回一个jquery对象.以保证插件的可链式操作
        7. 避免在插件内使用$符号应使用完整的jquery来表示
      3. 插件中的闭包
      4. jquery插件的机制
        1. jquery.fn.extend()方法
        2. jQuery.extend()方法
      5. 编写jQuery插件
        1. 封装jQuery对象方法的插件
        2. 封装全局函数的插件
        3. 自定义选择器
  8. 用jQuery打造个性类淘宝网站
    1. 网站结构
      1. 图片
      2. 样式表
        1. 先编写全局样式
        2. 编写重用的样式
        3. 编写主题内容样式
      3. javascript脚本
        1. 先确定完成哪些功能
        2. 再根据功能写代码实现
  9. jQuery Mobile
    1. HTML5简介
    2. web设计
      1. 结构层
      2. 表现层
      3. 行为层
    3. jQuery mobile主要特性
      1. 基于jQuery构建
      2. 兼容大部分手机平台
      3. 轻量级库.模块化结构
      4. html5标记驱动的配置
      5. 渐进增强原则和自适应响应设计
      6. 强大的ajax的导航系统
      7. 易用性
      8. 统一的ui组件
      9. 强大的主题化框架
    4. 使用jQuery mobile
      1. 使用jQuery mobile必备的3个文件
        1. jquery.mobile.css
        2. jquery.js
        3. jquery.mobile.js
      2. data-role属性
        1. date-role属性很多值
      3. data-inset="true"
      4. data-theme="e"
    5. 其他框架
      1. 移动框架
        1. jqMobi
        2. sencha touch
        3. zepto.js
      2. PhoneGap
  10. jQuery各个版本的变化
  11. jQuery性能优化技巧
    1. jQuery性能优化
      1. 使用最新版本的jQuery库
      2. 使用合适的选择器
      3. 缓存对象
      4. 循环时的DOM操作
      5. 数组方式使用jQuery对象
      6. 事件代理
      7. 将自己的代码转化成jQuery插件
      8. 使用join()把数组转化为字符串
      9. 合理利用html5的data属性
      10. 尽量使用原声的javascript方法
      11. 压缩javascript文件
    2. jQuery技巧
  12. 附录总结
    1. 附录A 关于$(document).ready()函数
    2. 附录B Firebug
    3. 附录C Ajax的XMLHttpRequest对象的属性和方法
      1. readyState属性
        1. 0 未初始化状态
        2. 1 准备发送状态.此时刚调用open()方法准备发送请求到服务器
        3. 2 已发送状态 此时通过send()方法把一个请求发送到服务器但还没有收到回应
        4. 3 正在接收状态 已经收到http响应头部信息但是还没有完成
        5. 4 完成响应状态 此时已经完成了httpResponse响应的接收
      2. responseText属性
      3. responseXML属性
      4. status属性
      5. statusText属性
      6. onreadystatechange事件
      7. open()方法
      8. send()方法
      9. abort()方法
      10. setRequestHeader()方法
      11. getRequestHeader()方法
    4. 附录D jQuery $.ajax()方法的参数详解
    5. 附录E jQuery加载并解析XML
      1. XML简述
        1. 任何起始标签都必须有一个结束标签
        2. 可采用简化语法
        3. 标签必须按照合理的顺序进行嵌套
        4. 所有的属性都需要有值且需要在值周围加上双引号
      2. Content-Type
      3. XML结构
        1. xml结构必须是封闭的
        2. XML文档只能有一个顶层元素
      4. 获取XML
      5. 解析XML
      6. 禁用缓存
    6. 附录F 插件API
    7. 附录G jQuery 速查表