jQuery框架的基本了解

使用jQuery：必须先引入jQuery

$(document).ready跟window.onload的区别

• window.onload是等页面所有的内容(dom,音频，视频，图片，GIF等)加载完成的时候，才调用函数
• $(document).ready只是DOM加载完成的时候，就开始执行

// 测试代码
window.onload=function(){
  alert('javascript');
}
$(function(){
  alert('jQuery');
})

JS和jQuery的关系

• jQuery只是一个工具库，会jQuery不一定会JS，但是如果会JS，一定会jQuery
• jQuery比JS简单很多，操作元素很方便
• jQuery和JS可以互相转换
  • jQuery转换为JS：通过[] 或 get()
  • JS转换为jQuery：$(原生)
• jQuery方法函数化，除了length，我们常用的其他属性，都是方法的调用 $().xxx()
• jQuery可以进行链式操作：能否进行链式操作，取决于前面函数的返回值

获取元素

• $("#ele") id
• $("ele") 标签名，如果指定一个元素，用eq()
• $(".ele") 类名
• • 获取所有标签
• $(".wrap div,.wrap p") 获取多个元素，可以用逗号分隔
• $("[attr]") $("[div[id=div1]") $("[attr1][attr2]") 属性选择器
• $("div").first() (同理：first / last / eq)
• $("div:first") (同理：first / last / eq)
• $("div:even") even是偶数 odd是奇数
• $(".wrap").find("p") 找到的是子子孙孙
• $(".wrap").children("p") 找到的是儿子

jQuery中的取值、赋值合体

• html(): 普通标签：不传参数，是取值，传了参数为字符串的话，是设置

• div / p / ol / ul / dl / dt / dd / h1...h6
• del / i / ins / span / b

• val(): 表单元素通过val来进行取值、赋值，参数跟html()一样
  • input / textarea / form
• css(): 用来获取、赋值样式
  • 一个参数
    • 如果这个参数是字符串，是获取
    • 如果这个参数是对象，是设置
• attr(): 用来获取、赋值属性
  • 一个参数
    • 如果参数是字符串，是获取
    • 如果参数是对象，是设置一堆

操作class名

• addClass 添加
• removeClass 移除

事件

• 在原生JS中
  • DOM 0 级事件：同一个元素， 同一行为上，只能绑定一个方法，后面的方法会覆盖前面的方法
  • DOM 2 级事件：同一个元素，同一行为上，可以绑定多个方法，但是，它不兼容，在IE下，需要使用attachEvent
• jQuery中

• on 绑定事件
• one 代表触发一次
• off 解除事件
• trigger 自动触发