由于主要还是负责后端,所以前端很多东西都不熟悉,jQuery作为web开发必备技能,有很多知识点,老是记不清楚,所以在这边整理一下。
1.加载页面后执行
$(function(){ //程序段 })
2.点击事件
$("#xxx").click(function(){ //程序段 })
3.给元素添加class,或者改变class
$("#xxx").addClass("class1");
//点击时候改变样式 $("#aaa").click(function() { $("#xxx").toggleClass("class1"); });
4.给元素的css,html属性赋值
$("#xxx").css("display","block");
$("#xxx").html("this is html<br/> this is html");
5.获取一个jquery元素
var a=$("#xxx");//获取id为xxx的jquery对象 var b=$(".xxx");//获取class为xxx的jquery对象
6.获取对象的值
$(".xxx").val();//文本框或者下拉框的值 $(".xxx").html();//对象的html内容 var sex=$("#radio1").is(":checked")?"男":"女";//radio1的值 var marry=$("#checkbox1").is(":checked")?"已婚":"未婚";//复选框的值
7.选择器
//基本选择器 $("#table1 tr:nth-child(even)").addClass("trOdd"); $("#divOne").val()//ID为divOne的元素 $(".divOne").val()//class为divOne的元素 $("div span").val()//div下的span元素,注意是空格隔开,表示下级元素 $(".class1 .class2").val()//class为class1下的class为class2的元素,同上 $("#divClass,span").val()//id为divClass或者span元素,都逗号表示或的关系 //层次选择器 $("div span").val();//div下的所有span,祖先跟后代关系,不管是几层嵌套,反正只要是div下的span都选择 $("div>span").val();//div下第一层的span,父子关系,注意只选中第一层span。 $("#divMid + div").val();$("#divMid").next("div").val();//id为divMid的下一个div元素 $("#divMid ~ div").val();$("#divMid").nextAll("div").val();//id为divMid后面的所有div元素 $("#divMid").siblings("div").val();//id为divMid的相邻的div元素