$(document).ready(function(){代码表达式});文档加载完毕后执行JQ代码
l事件
$(“#id”).click(function(){代码表达式});点击事件
$(“#id”).focus(function(){代码表达式});获取焦点事件
$(“#id”).blur(function(){代码表达式});失去焦点事件
$(“#id”).mouseover(function(){代码表达式});鼠标悬停事件
$(“#id”).mouseout(function(){代码表达式});鼠标移出事件
$(“#id”).on();绑定事件
$(“#id”).hover();鼠标事件
$(“#id”).bind(“mouseentermouseleave”,handlerInOut);
$(“#id”).hover(handlerInOut);鼠标事件切换
$(“#id”).toggle();鼠标点击显示隐藏切换
$(“#id”).change();元素值发生改变时相应(textarea,select)
$(“#id”).focus();元素获取焦点时
$(“#id”).blur();元素失去焦点时
l获取内容
$(“#id”).text()返回所选元素的文本内容
$(“#id”).html()返回所选元素的内容(包括HTML标记)
$(“#id”).val()返回所选元素的表单字段的值
$(“#id”).attr(“src”)返回所属元素的属性值
l设置内容
$(“#id”).text(“文本”)设置文本内容
$(“#id”).html(“HTML”)设置HTML内容
$(“#id”).val(“值”)设置值
$(“#id”).attr(“href”,”http://www.baidu.com”)设置href
l设置多个属性值
$(“#id”).attr({
“href” : “http://www.baidu.com”,
“title” : “title”,
“src” : “src”
});
l添加元素
$(“#id”).append()在被选元素的结尾插入内容(直接在标签里面插入内容)
$(“#id”).prepend()在被选元素的开头插入内容(直接在标签里面插入内容)
$(“#id”).after()在被选元素之后插入内容(在标签后面插入内容)
$(“#id”).before()在被选元素之前插入内容(在标签后面插入内容)
l创建元素
Var txt1= $(“”).text(“Text”)JQ创建新元素
Var txt2= “
Text
”HTML创建新元素Var txt3= Document.createElement(“p”)
Txt3.innertHTML=”Text”;DOM创建新元素
$(“#id”).append(txt1,txt2,txt3)追加元素
l删除元素
$(“#id”).remove()删除元素
$(“#id”).empty()删除被选元素的子元素
$(“p”).remove(“.p”)删除P标签下类名为P的元素
$(“img”).removeAttr(“src”)删除图像的src属性
l设置CSS类
$(“#id”).addClass()向所选元素添加一个或多个类
$(“#id”).removeClass()从被选元素删除一个或多个类
$(“#id”).css()返回被选元素样式属性
$(“#id”).toggleClass()对被选元素进行添加/删除类的切换操作
l尺寸
$(“#id”).width()设置或返回元素的宽度
$(“#id”).height()设置或返回元素的高度
$(“#id”).innerWidth()返回元素的宽度(含内边距)
$(“#id”).innerHeight()返回元素的高度(含内边距)
$(“#id”).outerWidth()返回元素的宽度(含内边距和边框和外边距)
$(“#id”).outerHeight()返回元素的高度(含内边距和边框和外边距)
l遍历
$(“#id”).parent()返回被选元素的直接父元素
$(“#id”).parents()返回被选元素的所有祖先元素
$(“#id”).parentsUntil()返回介于2个给定元素之间的所有祖先元素
$(“#id”).children()返回被选元素的直接子元素
$(“#id”).find()返回被选元素的所有后代元素
$(“#id”).siblings()返回被选元素的所有同胞元素
$(“#id”).next()返回被选元素的下一个同胞元素
$(“#id”).nextAll()返回被选元素的下面的所有同胞元素
$(“#id”).nextUntil()返回介于2个给定元素直接的所有同胞元素
$(“#id”).prev()返回被选元素的上一个同胞元素
$(“#id”).prevAll()返回被选元素的上面的所有同胞元素
$(“#id”).first()返回被选元素的首个元素
$(“#id”).last()返回被选元素的最后一个元素
$(“li”).eq()返回被选元素中带有指定索引号的元素
$(“p”).filter(类名或ID名)返回匹配的元素
$(“p”).not(类名或ID名)返回不匹配的元素
lAJAX
$(“#id”).load(url,callback函数)从服务器加载数据,并把数据放入被选元素中
$.get(url,callback函数)以GET方式从服务器上请求数据
$.post(url,data,callback函数)以POST方式从服务器上请求数据
$.getJSON(url,data,callback)以GET方式来加载远程JSON数据
$.ajax()把远程数据加载到XMLHttpRequest对象中
例子:
$.ajax({
url : “www.baidu.com”,
status : “success”
})
lJSON对象
Var obj = Eval(JSON对象)解析JSON对象数据
l选择器
$(“tr:odd”)查找表格的2,4,6行
$(“tr:add”)查找表格的1,3,5行
$(“form > input”)匹配表单中的所有子级input元素
$(“tr:eq(0)”)查找第一行
$(“tr:gt(0)”)查找比第一行大的行
$(“tr:lt(2)”)查找比第三行小的行
$(“:header”)匹配如h1,h2之类的标题元素
$(“td:empty”)查找所有不包含子元素或者文本的空元素
$(“div:has(p)”)匹配含有p元素的div元素
$(“td:parent”)查找所有含有子元素或者文本的td元素
$(“tr:hidden”)查找隐藏的tr
$(“input:hidden”)查找type为hidden的元素
$(“tr:visible”)查找所有可见的tr元素
$(“:checkbox”)查找所有复选框
$(“input:checked”)查找所有选中的复选框
l筛选
$(“div”).hasClass()检查当前元素是含有某个特定的类
$(“p”).slice(0,2)选择前2个P元素