ul标签中,li标签的移除、属性值获取

来源:互联网 发布:佛罗里达州立大学 知乎 编辑:程序博客网 时间:2024/06/15 07:38

1、HTML

<ul id="ul_1"><li id="1_1">111_1</li><li id="2_1">222_1</li><li id="3_1">333_1</li><li id="4_1">444_1</li><li id="5_1"">555_1</li></ul><ul id="ul_2"><li id="1_2"><span>小明</span></li><li id="2_2"><span>小红</span></li><li id="3_2"><span>小张</span></li><li id="4_2"><span>小刘</span></li><li id="5_2"><span>小王</span></li></ul><input type="button" value="移除" onclick="remove();"><input type="button" value="获取" onclick="getAllLi();">

2、JS

//移除function remove(){//$("#ul_1").children().filter("#1_1").remove();//1、移除ul下单个li//$("#ul_1").find("#2").remove(); //2、移除ul下单个li//$('#ul_1 #3_1').remove();//3、移除ul下单个li$('#ul_2 li').each(function(){//4、移除ul下所有li    $(this).remove();}); }//获取function getAllLi(){//var id = $("#ul_2 li").attr("id");var ulOne = document.getElementById("ul_2");var lis = ulOne.getElementsByTagName("li");var strIds = "";var strNames = "";for(var i=0;i<lis.length;i++){ strIds = strIds + "," + lis[i].id;var li = document.getElementById(lis[i].id);var span = li.getElementsByTagName("span");strNames = strNames + "," + span[0].innerHTML;} alert(strNames);//,小明,小红,小张,小刘,小王alert(strIds);//,1_2,2_2,3_2,4_2,5_2}

3、业务场景


注意事项:

1、引入JQuery;


声明:

仅供参考