ul中有li,点击li,获得对应的序号
时间: 2024-03-23 21:37:36 浏览: 127
ul的li样式
您可以使用JavaScript来实现此功能。您可以给每个li元素添加一个onclick事件处理程序,然后在点击时获取其index并将其存储在一个变量中。以下是一个示例代码:
HTML代码:
```
<ul id="myList">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
```
JavaScript代码:
```
var myList = document.getElementById("myList");
var selectedIndex;
for (var i = 0; i < myList.children.length; i++) {
myList.children[i].onclick = function() {
selectedIndex = Array.prototype.indexOf.call(myList.children, this);
console.log(selectedIndex);
}
}
```
在这个示例中,我们首先获取了ul元素和一个变量selectedIndex来存储所选li的索引。然后,我们循环遍历每个li元素,并为其添加一个onclick事件处理程序。在事件处理程序中,我们使用Array.prototype.indexOf.call()方法获取所选li元素在其父元素中的索引,并将其存储在selectedIndex变量中。最后,我们使用console.log()函数将所选li元素的索引输出到控制台中。
阅读全文