学习心得
一、专业课
1.反选checkbox实现
$("#in3").click(
function(){
//选中每一个元素都会去执行
//alert(1);
$("input[type=checkbox]").each(
function(){
//获取属性的值trueor false
if($("this").prop("checked")){
$(this).removeAttr("checked");
}else{
$(this).prop("checked",true);
}
}
);
}
);
2.获取选中的值
$("select1").change(
function() {
$(":selected").each(
function(){
//alert($(this).val);//$(this)== jq变量
alert(this.value);//this== js变量
}
);
}
);
3.使用jQuery遍历祖先元素
$(document).ready(
function(){
//获取直接父元素
//$("#li1").parent().css("color","red");
//返回所有父元素
//$("span").parents().css("color","orange");
//有多个span时，从底部开始找，从底部开始算
//$("span").parents().eq(1).css("color","orange");
//不包括#d1，从0开始算
//*$("span").parents("#d1").eq(1).css("color","orange");
//不包括#d1，从0开始算
//$("span").parentsUntil().css("color","orange");//==$ (span)
//不包括#d1，从0开始算 查找在span~#d1之间的祖先元素，不包 括#d1
//$("span").parentsUntil("#d1").eq(0).css("color","green");//==$(span)
//所有子元素
//$("#u2").children().css("color","green");
//$("#u2").children("#li4").css("color","red");
//查找所有
//varlen = $("#d3").find("*").length;
//alert(len);
//过滤查找后代元素中span的第二元素
//$("#d3").find("span").eq(1).css("color","orange");
//同胞元素
//$("#li1").siblings().css("color","red");
//加过滤条件 同胞元素中有id为li2的元素
//$("#li1").siblings("#li2").css("color","green");
//下一个同胞元素
//$("#li1").next().css("color","red");
//返回所有的同胞元素
//$("#li1").nextAll("").css("color","red");
//有过滤的条件
//$("#li1").nextAll(".c1").css("color","green");
//返回参数之间的所有后面同胞元素 不包括条件的元素(.c3)
//$("#li1").nextUntil(".c3").css("color","green");
//没参数时候
//$("#li1").nextUntil().css("color","red");
//$("#li1").nextUntil().eq(3).css("color","red");
//往前面找同胞元素
//$(".c3").prev().css("color","orange");
//$(".c3").prevAll().css("color","yellow");
//$(".c3").prevAll("#li2").css("color","blue");
//$(".c3").prevAll().eq(0).css("color","green");
//$(".c3").prevUntil().css("color","green");
//$(".c3").prevUntil("#li1").css("color","green");
$("p").first().css("color","orange");
}
);
4.dom节点操作
$(document).ready(
function(){
//创建节点
var$obj = $("<li id='d1'>衡阳</li>");
//追加节点,内部节点后追加
//$("#city").append($obj);
//$obj.appendTo($("#city"));
//在内部前面追加
//$("#city").prepend($obj);
//$obj.prependTo($("#city"));
//在元素外部添加
//后面
//$("#city").after($obj);
//$obj.insertAfter($("#city"));
//前面
//$("#city").before($obj);
//$obj.insertBefore($("#city"));
/*$("li").click(
function(){
$(this).remove();
}
);*/
}
);
$(document).ready(
function(){
$("li").click(
function(){
//$(this).remove();
}
);
//清空
//$("#city").empty();
});
学习心得：
1.业精于勤荒于嬉。
