jQuery入门&选择器

一. 3W1H

1.1 what ? 是什么

jQuery就是JavaScript库，封装了很多js代码（类库）
官方地址：http://jquery.com/

1.2 why？为什么要学习

为了简化JavaScript开发：选择器，CSS，HTML事件处理，JS动画，浏览器兼容，丰富插件
理解官方jQueryLOGO：理念write less，do more

1.3 where？哪些情况下用

• 中大型网站开发
• 一些前端框架的基础：比如easyUI，bootstrap

1.4 how？怎么用

工具：HBuilderX
使用jQuery步骤：1.下载jQuery库
2.引入：将js文件复制到项目中
3.使用

二.jQuery文件结构

jQuery版本：

1.x版本：能够兼容IE678浏览器（不再更新版本）
2.x版本：不能兼容IE678浏览器（不再更新版本）
3.x版本：不能兼容IE678浏览器，更加的精简（在国内不流行，因为国内使用jQuery的主要目的就是兼容IE678）

jQuery文件中可以看出是一个自执行函数

(function(){
window.jQuery=window.$=jQuery
}());

自执行函数

自执行函数也叫立执行函数，是将函数的声明和调用合并在一起

三. $ 和 $()

• $代表jQuery对象（Java类），同时也是一个函数对象，即 $和jQuery是等价的。
• $()构造了一个jQuery对象。所以，
  $()可以叫做jQuery的构造函数

$(function(){})
$("选择器")
$("标签")
$(DOM对象)

• 在jQuery文件中，$和jQuery作为了window对象的一个属性
  源码：window.jQuery=window. $=jQuery;
  检测 $的类型：object.prototype.toString.call( $);

四. jQuery选择器

1.1 基本选择器

• ID选择器：#ID —单个元素
• 类选择器：.class —元素集合
• 元素选择器：element —元素集合
• 通配符选择器：* —元素集合
• 群组选择器（并集）：selector1，selector2 —元素集合

1.2 层次选择器

• 后代选择器（交集）：selector1 selector2 —元素集合
• 子代选择器：> —元素集合

1.3 过滤选择器

• 获取第一个元素 :first
• 获取最后一个元素 :last
• 获取偶数下标的元素 :even
• 获取奇数下标的元素 :odd
• 获取某一范围元素 :gt大于 :lt小于

1.4 表单选择器

• 获取选择单选框的值
• 获取选择多选框的值
• 获取选择下拉框