首页hbuilder练习：使用循环结构在网页输出 * ** *** ****

hbuilder练习：使用循环结构在网页输出 * * ****

时间: 2024-09-13 18:00:19 浏览: 44

在HBuilder中，你可以利用HTML和JavaScript结合循环结构来动态地在网页上输出内容。下面是一个简单的例子，我们将使用`for`循环遍历数组，并将数组元素显示在一个列表中： ```html <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>循环输出示例</title> </head> <body> <ul id="outputList"></ul> <script> // 假设我们有一个字符串数组 var items = ['Hello', 'World', 'HBuilder', 'Practice']; // 使用JavaScript的for循环 for (var i = 0; i < items.length; i++) { // 创建一个新的列表项 var listItem = document.createElement('li'); // 将当前元素添加到列表项文本 listItem.textContent = items[i]; // 将列表项添加到页面的输出列表 document.getElementById('outputList').appendChild(listItem); } </script> </body> </html> ``` 在这个例子中，每次循环都会创建一个新的`<li>`元素，将其文本设置为数组中的下一个值，然后添加到id为`outputList`的`<ul>`标签中。运行这段代码后，网页会显示一个包含数组元素的无序列表。

阅读全文