JQuery基础

一、概念
jQuery是一套跨浏览器的JavaScript库，简化HTML与JavaScript之间的操作。

$(document).ready(function(){写JQuery语句});
JS写在body中的时候所有语句写在上面里

二、选择器
1、基本选择器
id:$("#div1")
class:$(".div1")
标签:$("p")
并列:$("#div1,#div2") 用,隔开
后代:$("#div1 p") 用空格隔开
2、过滤选择器
首个:$("#div1:first")
尾个:$("#div1:last")
任意一个:$("#div1:eq(索引)")或$("#div1").eq(索引)
大于:$("#div1:gt(索引)")
小于:$("#div1:lt(索引)")
排除:$("#div1:not(选择器)")
奇数索引:$("#div1:odd")
偶数索引:$("#div1:even")

属性名过滤:$(".div[aaa]")
属性值过滤:$(".div[aaa=2]")或$(".div[aaa!=2]")

内容过滤:
文字 $("#div1:contains("字符串")")
子元素:$("#div1:has("选择器")")

三、事件
1、基本事件
JS中的事件去掉on
2、复合事件
hover(function(){},function(){}); 相当于移入和移除事件
toggle(function(){},function(){},function(){},...);点击时依次循环
3、事件冒泡
JQuery中执行完本次事件后，如果父级有事件，会接着执行父级事件
阻止事件冒泡：return false;

四、DOM操作
1、操作属性
获取属性 var s=$(this).attr("属性名");
设置属性 $(this).attr("属性名","属性值");
删除属性 $(this).removeAttr("属性名");
2、操作样式
(1)操作内联样式
设置样式 $(this).css("属性名","属性值").css("属性名","属性值")...;
获取样式 $(this).css("属性名") 或者 $(this).offset

//返回偏移坐标：
$(selector).offset()
//设置偏移坐标：
$(selector).offset({top:value,left:value})
//使用函数设置偏移坐标：
$(selector).offset(function(index,currentoffset))

(2)操作样式表的class
添加class $(this).addclass("class名");
移除clsss $(this).removeclass("class名");
添加与移除交替 $(this).toggleclass("class名");
3、操作相关元素
(1)查找
父辈parent() 前辈parents(选择器)
子级children() 后代find(选择器)
哥 prev() prevAll(选择器)
弟 next() nextAll(选择器)
(2)操作
复制 clone()
新建 $("HTML字符串") 或者 var s="HTML字符串";
移除内部全部元素 empty()
移除元素本身 remove()
添加到内部 appen(JQuery对象)
添加到平级下面 after()
添加到平级上面 before()

4、操作内容
(1)表单元素
取值var ss=$("选择器").val();
赋值：$("选择器").val("值");
(2)非表单元素
取值var ss=$("选择器").html(); var ss=$("选择器").text();
赋值$("选择器").html("内容")； $("选择器").text("内容");
5、未来元素
(1) 对象.live("事件名",function(){})
(2) 动态添加到网页中的对象的事件不会执行，当写上未来元素才执行。