当前位置:编程学习 > JS >>

javascript中如何获得ul中所有列表项的值

答案:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>javascript获取ul节点的所有子节点内容</title> <script type="text/javascript"> //在页面加载的时候为id为clk_btn的按钮绑定onclick事件 window.onload=function(){ //得到id为clk_btn的按钮节点 var clk_btn = document.getElementById("clk_btn"); //alert(clk_btn); clk_btn.onclick=function(){ //得到id为ulNode的节点 var ulNode = document.getElementById("ulNode"); //得到ulNode所有的孩子结点 var childrens = ulNode.childNodes; //alert(childrens.length); var len = childrens.length; //循环遍历所有孩子结点,并输出节点内的值 for(var i=0;i<len;i++){ alert(childrens[i].nodeName); alert("第"+(i+1)+"节点的内容是:"+childrens[i].innerHTML); } } } </script> </head> <body> <ul id="ulNode"> <li>first one</li> <li>second one</li> <li>third one</li> <li>fourth one</li> <li>fifth one</li> </ul> <input type="button" value="click me" id="clk_btn"/> </body> </html> 以上代码在IE中能正常运行,由于FF与IE关于DOM有不同的特性,所以在FF中运行有些许不同,你可以试试!
其他:这些东西不要自己写啦!
用jQuery把
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('ul#id>li').each(function(i){
        alert($(this).val())
    })
})
</script>

解析:
#引用JQ库
#$(document).ready
页面元素都加载好之后执行
#$('ul#id>li')
查找找出id=id的ul元素
>li 的意思是在ul的下级元素中找出li
.each  的意思是遍历一次所有找到的元素
$(this)  当前找到的元素,就是你要的li,这里是循环的
你可以用其他形式保存也可以。
例如 str+=$(this).val()  等等 试一下这个document.getElementById('myul').getElementsByTagName('li').innerText 

上一个:两个字符串的"56.5"和 "56.18", 保留两位小数,怎样相加啊?用javascript来解决~~~
下一个:Javascript Firebug总是显示TypeError: N.length is not a function。求帮助!

CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,