在HTML div标记中循环表达式以使用Javascript

在HTML中的<div>标记中使用循环表达式，你需要使用JavaScript

使用for循环：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Loop Example</title>
    <script>
        function createDivs() {
            for (let i = 0; i < 5; i++) {
                let div = document.createElement('div');
                div.textContent = `Div ${i + 1}`;
                document.getElementById('container').appendChild(div);
            }
        }
    </script>
</head>
<body onload="createDivs()">
    <div id="container"></div>
</body>
</html>

使用forEach循环（需要一个数组）：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Loop Example</title>
    <script>
        function createDivs() {
            let divs = [];
            for (let i = 0; i < 5; i++) {
                divs.push(`Div ${i + 1}`);
            }

            divs.forEach(divText => {
                let div = document.createElement('div');
                div.textContent = divText;
                document.getElementById('container').appendChild(div);
            });
        }
    </script>
</head>
<body onload="createDivs()">
    <div id="container"></div>
</body>
</html>

在这两个示例中，我们都使用了一个名为createDivs的JavaScript函数，该函数在页面加载时调用。在第一个示例中，我们使用for循环直接创建<div>元素。在第二个示例中，我们首先创建一个包含<div>标签文本的数组，然后使用forEach循环遍历数组并创建<div>元素。

请注意，为了避免页面重绘，你可以使用DocumentFragment来批量插入<div>元素。这是一个高级技巧，可以提高性能，特别是在处理大量元素时。