原生li标签遍历数组
时间: 2024-12-22 18:29:02 浏览: 2
原生JS实现图片无缝滚动方法(附带封装的运动框架)
在HTML中,原生`<li>`标签通常用于创建列表项,当你需要通过JavaScript遍历数组并在列表中显示每个元素时,可以这样做:
```html
<ul id="listItems"></ul>
<script>
// 假设我们有一个数组
var items = ["Item 1", "Item 2", "Item 3"];
// 获取到ul元素
var ulElement = document.getElementById("listItems");
// 遍历数组
for (var i = 0; i < items.length; i++) {
// 创建一个新的li元素,并将数组元素添加为文本内容
var liElement = document.createElement("li");
liElement.textContent = items[i];
// 将新创建的li添加到ul中
ulElement.appendChild(liElement);
}
</script>
```
在这个例子中,`for`循环逐个取出数组中的元素,然后用`createElement()`函数创建新的`<li>`元素,并设置其文本内容为当前数组项。最后,将这些`<li>`元素添加到`<ul>`(无序列表)元素里。
阅读全文