jq的增删改查

$(function(){
/*增*/
$("button").click(function () {
$(".kuang").append($('<li class="box">li标签</li>'));
})
/*查*/
$('li').eq(0).css('background','red')
/*等同于*/
$('li').first().css('background','red');/*第一个节点*/
$('li').last().css('background','royalblue');/*最后一个*/
//指定获取集合中第二和第三元素
$("li").slice(1,3).css('background-color','yellow');

//若slice()只有1个参数,则意味指定起始位置,默认结束位置到最后
//设置第2个至第4个元素样式
$("li").slice(1).css('background-color','yellow');
$("ul").children().css('background','white');/*他所有的孩子标签,找不到孙子*/
$('ul').find('li').css('background','sandybrown');/*他所有的子标签,包括孙子*/
$('li').parent().css("background","firebrick")/*子标签找父标签,儿子找爸爸*/
$("li").parents().css("background-color","red");/*孙子,儿子找老子祖宗*/
$('li').closest('.ss').css('background','red')/*找到特殊标签爱的*/
/*增删改*/
var sdf = $("<li>");
sdf.html('libians')
$("ul").append(sdf);
$('ul').append($('<li class="ss">asdsd</li>'));/*增放在最后*/
$('ul').prepend($('<li class="ss">asdsd</li>'));/*增放在最前*/
$('li').eq(2).before($('<li class="ss">asdsd</li>'));/*增放在指定位置前面*/
$('li').eq(2).after($('<li class="ss">asdsd</li>'));/*增放在指定位置后面*/
$('ul li') .eq(0).remove();/*删除*/

});

posted @ 2017-04-27 10:27  李笑吅  阅读(414)  评论(0编辑  收藏  举报