JS动态增加删除UL节点LI及相关内容示例_javascript技巧

复制代码 代码如下:

• 11111111111111111del


• 22222222222222222del


• 33333333333333333del


• 44444444444444444del


• 55555555555555555del

please select
11111
22222
33333
44444


<script> <br><br>function $$(id){ <BR>var obj=document.getElementById(id); <BR>return obj; <BR>} <br><br>function del(n) { <BR>$$('ul').removeChild($$(n)); <BR>} <br><br>function add(id,txt) { <BR>var ul=$$('ul'); <BR>var li= document.createElement("li"); <BR>var href_a = document.createElement("a"); <BR>href_a.href="javascript:del('"+id+"');"; <BR>href_a.innerHTML ="del"; <BR>li.innerHTML=txt; <BR>li.id=id; <BR>li.appendChild(href_a); <BR>ul.appendChild(li); <BR>} <br><br>function add_car(obj){ <BR>//chk ul childNodes length <BR>if($$('ul').childNodes.length<3){ <BR>var flag=true; <BR>var ul_obj=$$('ul').childNodes; <BR>var car_id=obj.options[obj.selectedIndex].value; <BR>var txt=obj.options[obj.selectedIndex].text; <BR>if(car_id!=null&&car_id!=""){ <br><br>for(var i=0;i<ul_obj.length;i++){ <br><br>if(ul_obj[i].id==car_id){ <BR>alert("已经添加！"); <BR>flag=false; <BR>} <BR>} <br><br>if(flag){ <BR>add(car_id,txt); <BR>} <BR>} <br><br>}else{ <BR>alert("只允许加入三个值!"); <BR>return; <BR>} <BR>} <br><br>function getulvalue(){ <BR>if($$('ul').childNodes.length==0){ <BR>alert("请选择相关内容!"); <BR>return; <BR>}else{ <BR>var txt=""; <BR>for(var i=0;i<$$('ul').childNodes.length;i++){ <BR>txt+=$$('ul').childNodes[i].id+","; <BR>} <BR>$$("ul_value").value=txt; <BR>} <br><br>} <BR></script>