1、$(document).ready(function(){.............})相当于onload事件JS
简写$(function({.............});
2、var val=$("div>p").html();获取文本值
var val=$("div>p").html("你好");设置文本值
appendTo:增加元素,$("
增加的内容
attr:属性,设置或返回,$("body").attr("bgcolor","blue");
hide():隐藏
show():显示,$("FORM").show();
find:复制一个函数对象,$("div")=div var; $(div).find("p").html();
this.src="2.jpg":替换,each()所有都替换
$("img").each(function(){
this.src="2.jpg";
})
eg();选择指定下标的匹配元素
size()/length():获取标签数量长度
val():获取表单字段的值,var val=$("input").val()
3、选择器
id选择器:$("#img_1").attr(src);
类选择器:class, $(".ps").size();
通配符选择器:(*), $("*").size();
组合选择器:$("#img_2,#img_3").attr("width","300");
层次选择器:
获取当前元素中的指定元素:$("#div_1 p").get(2).innerHTML;
获取元素级别的所有指定元素:$("#div_1 >p").get(2).innerHTML;
选取下一个同辈元素:$("#img_1 +img").attr("src","1.jpg");
选取跟在指定元素之后的所有的指定元素:$("#img_1~img").eq(1).attr("src","1.jpg");
过滤选择器:
选取第一个:$("img:first").attr("src","URL");
选取最后一个:$("img:last").attr("src","URL");
去除所有与给定选择器匹配的元素:$("img:not(.img_s)").attr("src","URL");
索引偶数的元素:$("img:even").attr("src","URL");
索引奇数的元素:$("img:odd").attr("src","URL");
选取指定索引的元素:$("img:eq(1)").attr("src","URL");
大于指定索引的元素:$("img:gt(0)").attr("src","1.jpg");
小于指定索引的元素:$("img:lt(2)").attr("src","URL");
选取所有标题元素:$(":header").eq(1).html();
选取所有包含指定文本的元素:$(":header:contains("题")").eq(1).html();
选择所有的空的指定标签:$("p:empty").eq(0).html("段落3");
选取所有不包含指定冤死的标签:$("div:not(:has(p))").eq(0).html("不包含p标签");
选择拥有子元素的元素:$("div:parent").eq(0).attr("style","color:red;");
获取所有隐藏文本:$("input:hidden").eq(0).val();
可见文本:$("input:visible").eq(0).val();
获取含有指定值属性的元素:$("img[class]").eq(0).attr("src","1.jpg");
选取属性值为指定值的元素:$("img[id=img-1]").attr("src","1.jpg");
选取属性值不等于指定值的元素:$("img[id=img-1]").attr("src","1.jpg");
选取属性值以指定值开始的元素:$("img[id=img]").attr("src","1.jpg");
结束的元素:$("img[id=1]").attr("src","1.jpg");
含有指定属性中字符的元素:$("img[id*=_]").attr("src","1.jpg");
选取指定属性等于指定值或以指定值为前缀的元素:$("img[id=img]").attr("src","1.jpg");
属性组合选择:含有id属性并以1结尾的元素,$("img[id][]id$=1").attr("src","1.jpg");
4、jQuery事件:
$(function(){.................});加载函数
$("#click").click(function(){...............});单击事件
$("#foc").focus(function(){....................});获取焦点
$("#foc").blur(function(){.................});失去焦点
$("#foc").keypress(function(){..................});键盘按下
$("#img_1").mouseover(function(){.................});鼠标移入变化
$("#img_1").mouseout()function(){..............};鼠标移出变化
$("#paw").select(function(){..................});文本被选中
$("#sel_1").chage(function(){....................});select菜单改变后弹出value值
$("#form_1").submit(function(){...............});表单提交
$("#bt_1").bind("click",function(){............});bind绑定事件
$("#tx_1").bind({"focus":function(){获取焦点},"blur":function(){失去焦点}});绑定多个焦点
$("#bt_2".click(function(){$("#tx_1").unbind("fous\\blur")}));解除绑定多个事件
mouseenter():事件指针穿过被选中元素时发生
mouseleave():与mouseenter()对应
5、通过.css方法设置元素样式
$("#bt_3").click(function(){
$("body").eq(0).css("backgroundcolor":"blue");
})
50、js\jquery函数:
http://www.w3school.com.cn/jquery/jquery_ref_effects.asp