前端学习--jQuery基础
一：jQuery介绍
jQuery 是一个 JavaScript 函数库
jQuery追求 "Write less,do more"
jQuery 极大地简化了 JavaScript 编程
引包：把jQuery源文件放到项目中
入口函数：当DOM载入就绪时执行js代码
jQuery两个变量：$、jQuery；$是jQuery的一个别名，所以用它俩的效果是一样的
二：jQuery核心
基础语法是：$(selector).action()
美元符号$定义 jQuery；
选择符（selector）“查询”和“查找” HTML 元素；
jQuery 的 action() 执行对元素的操作；
length：jQuery 对象中元素的个数
selector：返回传给jQuery()的原始选择器
jQuery(html,[ownerDocument])
根据提供的原始 HTML 标记字符串，动态创建由 jQuery 对象包装的 DOM 元素。同时设置一系列的属性、事件等。
//动态创建div元素，并添加属性与绑定事件
$("", {
"class": "test",
text: "Click me!",
click: function(){
$(this).toggleClass("test");
}
}).appendTo("body");jQuery对象与原生DOM对象可以相互转换：
如：jQuery对象[0] = 原生DOM对象；$(domEle) = jQuery对象
each(callback)：以每一个匹配的元素作为上下文来执行一个函数
$("button").click(function () {
$("div").each(function (index, domEle) {
// domEle == this;this指代的是DOM对象而非jQuery对象
$(domEle).css("backgroundColor", "yellow");
if ($(this).is("#stop")) {
$("span").text("Stopped at div index #" + index);
return false;
};
};
});
data([key],[value])：在元素上存放或读取数据,返回jQuery对象
三：选择器
jQuery可以使用CSS选择器。
部分选择器（除CSS选择器）：
:first
获取匹配的第一个元素
:hidden
匹配所有不可见元素
:last
获取匹配的最后一个元素
:visible
匹配可见元素
:first-child
匹配作为第一个子元素的元素
:first-of-type
其父元素的某个类型的第一个子元素
:last-child
匹配作为最后一个子元素的元素
:last-of-type
其父元素的某个类型的最后一个子元素
:not(selector)
去除与给定选择器匹配的元素
:nth-of-type()
其父元素的某个类型的第N个子元素
:even
匹配索引值为偶数的元素
:nth-child(index)
匹配其父元素下的第N个子元素，
index从1开始
:odd
匹配索引值为奇数的元素
:input
匹配所有input、textarea、select、button元素
:eq(index)
匹配给定索引值的元素
:text
匹配单行文本框，即type="text"
:gt(index)
匹配大于给定索引值的元素
:password
匹配密码框
:lt(index)
匹配小于给定索引值的元素
:radio
匹配所有单选按钮
:focus
匹配当前获取焦点的元素
:checkbox
匹配所有复选框
:contains(text)
匹配包含此文本的元素
:submit
匹配所有提交按钮
:empty
匹配所有不包含子元素或者文本的空元素
:image
匹配所有图像域
:has(selector)
包含给定选择器的元素
:reset
匹配所有重置按钮
:selected
匹配所有选中的option元素
:checked
匹配所有选中的元素(复选框、单选框等，
select中的option)
四：方法小结
1，属性方法
attr() ：设置或返回被选元素的属性值
$("#t1").attr("class","test");
$("#t1").attr({
"class" : "test",
"title" : "test"
});
removeAttr(name) ：删除一个属性
addClass()：添加类属性
removeClass()：删除类属性
toggleClass()：如果存在就删除一个类，不存在则添加一个类
text()：取得或设置匹配元素的内容
html()：设置或返回所选元素的内容（包括 HTML 标记）
val()：获得或设置匹配元素的当前值
2，CSS方法
css()：访问或设置元素的样式属性
css("propertyname"); css("propertyname","value");
css({"propertyname":"value","propertyname":"value",...});
height()：content高度
width()
innerHeight()：content高度+padding
innerWidth()
outereHeight()：content高度+padding+border
outerWidth()
3，文档处理方法
append() - 向每个匹配的元素内部追加内容
appendTo() - 把所有匹配的元素追加到另一个指定的元素元素集合中
prepend() - 向每个匹配的元素内部前置内容
prependTo() - 把所有匹配的元素前置到另一个、指定的元素元素集合中
after() - 在被选元素之后插入内容
before() - 在被选元素之前插入内容
insertAfter()：把匹配的元素插入另一个元素的后面
insertBefore()：把匹配的元素插入另一个元素的前面
remove() - 删除被选元素（及其子元素）
empty() - 从被选元素中删除子元素
clone() 克隆匹配的DOM元素并且选中这些克隆的副本。 clone(true) :参数true指示事件处理函数会被复制
$("p").remove();
$("p").remove(".hello");
4，遍历(筛选)方法
parent() 返回被选元素的直接父元素
children() 返回被选元素的所有直接子元素
find() 返回被选元素的后代元素，一路向下直到最后一个后代
first() 方法返回被选元素的首个元素
last() 方法返回被选元素的最后一个元素
eq() 方法返回被选元素中带有指定索引号的元素
siblings() 方法返回被选元素的所有同胞元素。
next() 方法返回被选元素的下一个同胞元素
nextAll() 方法返回被选元素的所有跟随的同胞元素
nextUntil() 方法返回介于两个给定参数之间的所有跟随的同胞元素
prev() 返回被选元素的前一个同胞元素
prevAll()
prevUntil()
filter() 方法允许您规定一个标准；不匹配这个标准的元素会被从集合中删除，匹配的元素会被返回
not() 方法返回不匹配标准的所有元素。
is(expr|obj|ele|fn)：根据选择器、DOM元素或 jQuery 对象来检测匹配元素集合，如果其中至少有一个元素符合这个给定的表达式就返回true。
5，事件方法
on(events,[selector],[data],fn) ：绑定事件处理函数
off(events,[selector],[fn]) ：移除事件处理函数
mouseenter() 当鼠标指针穿过元素时触发
mouseleave() 当鼠标指针离开元素时触发
mouseover() 鼠标指针穿过被选元素或其子元素时触发
mouseout() 鼠标指针离开被选元素还是其任何子元素时触发
click() 点击事件
dblclick() 双击事件
focus() 获得焦点事件
blur() 失去焦点事件
$("p").click(function(){
$(this).hide();
});
change()：当元素的值发生改变时触发
该事件仅适用于文本域（text field），以及 textarea 和 select 元素。当用于 select 元素时，change 事件会在选择某个选项时发生。当用于 text field 或 text area 时，该事件会在元素失去焦点时发生。
input()：在用户输入时触发
该事件在 或