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

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了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中运行有些许不同,你可以试试!
参考技术A 这些东西不要自己写啦!
用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() 等等
参考技术B 试一下这个document.getElementById('myul').getElementsByTagName('li').innerText

WinForm中如何获取datagridviewcomboboxcolumn下拉列表中下拉项的值?

参考技术A comboboxcolumn 里难道没有 selectItemIndex 什么的吗?用那个不是可以。。

以上是关于javascript中如何获得ul中所有列表项的值的主要内容,如果未能解决你的问题,请参考以下文章

DOM操作

如何根据每个无序列表中的列表项的数量在 Jquery 中隐藏按钮元素

如何获得MFC列表框中选中的数据

如何从列表视图中从 onItemClick() 获得的列表项的联系人 Uri 中检索数据?

WinForm中如何获取datagridviewcomboboxcolumn下拉列表中下拉项的值?

如何用JavaScript获得ul中的li的个数?