编写JavaScript代码，动态地向页面上的一个<ul>列表中添加多个<li>元素，每个<li>元素包含不同的文本内容

Question

编写JavaScript代码，动态地向页面上的一个

• 列表中添加多个
• 元素，每个
• 元素包含不同的文本内容。
  a.提示：使用createElement, appendChild, textContent等方法。

Answer 1

以下回复参考：皆我百晓生、券券喵儿等免费微信小程序作答:

你可以使用JavaScript的DOM操作方法如 createElement(), appendChild(), 和 textContent 来动态地向页面上的<ul>列表添加多个<li>元素。以下是一个简单的示例：

首先，假设你的HTML页面上有一个id为myList的<ul>元素：

<ul id="myList">
  <!-- 这里原本可能会有一些<li>元素 -->
</ul>

然后，你可以编写以下的JavaScript代码来动态添加多个<li>元素：

// 定义要添加到列表中的文本内容数组
var texts = ["文本1", "文本2", "文本3", "文本4", "文本5"]; // 可以根据需要修改这个数组

// 获取页面上的ul元素
var ul = document.getElementById("myList");

// 循环遍历数组，为每个文本创建一个li元素并添加到ul中
for (var i = 0; i < texts.length; i++) {
  // 创建一个新的li元素
  var li = document.createElement("li");
  
  // 设置li元素的文本内容
  li.textContent = texts[i];
  
  // 将新的li元素添加到ul元素中
  ul.appendChild(li);
}

这段代码会获取id为myList的<ul>元素，然后遍历一个包含不同文本内容的数组，为每个文本创建一个新的<li>元素，并设置其文本内容，然后将新的<li>元素添加到<ul>元素中。这样，页面上就会显示出包含不同文本内容的多个<li>元素。