html append

作者：以往的帅哥发布日期:2026-07-05 浏览:97

<!DOCTYPE html>
<html>
<head>
    <title>HTML Append Example</title>
    <script>
        function appendElement() {
            // 创建一个新的 div 元素
            var newDiv = document.createElement("div");
            // 设置新元素的内容
            newDiv.textContent = "这是一个通过 JavaScript 添加的新元素。";
            // 将新元素添加到 body 中
            document.body.appendChild(newDiv);
        }
    </script>
</head>
<body>
    <h1>HTML Append 示例</h1>
    <button onclick="appendElement()">点击添加新元素</button>
</body>
</html>

解释说明：

该示例展示了如何使用 JavaScript 动态地向 HTML 文档中添加新的元素。
document.createElement("div")：创建一个新的 <div> 元素。
newDiv.textContent：设置新创建的 <div> 元素的文本内容。
document.body.appendChild(newDiv)：将新创建的 <div> 元素添加到页面的 <body> 中。
页面上有一个按钮，点击按钮时会触发 appendElement() 函数，从而在页面中动态添加一个新的 <div> 元素。

上一篇：html引入css代码

下一篇：html运行在线