innerhtml的用法

作者：颠峰神射发布日期:2026-06-15 浏览:77

<!DOCTYPE html>
<html>
<head>
    <title>Inner HTML 示例</title>
</head>
<body>
    <div id="myDiv">这是一个初始内容。</div>
    <button onclick="changeContent()">点击我改变内容</button>

    <script>
        function changeContent() {
            // 使用 innerHTML 属性来更改元素的内容
            document.getElementById("myDiv").innerHTML = "<strong>内容已经被改变了！</strong>";
        }
    </script>
</body>
</html>

解释说明：

innerHTML 是一个属性，用于获取或设置指定元素的 HTML 内容。
在上面的示例中，我们有一个 div 元素和一个按钮。当用户点击按钮时，会触发 changeContent 函数。
该函数通过 document.getElementById("myDiv").innerHTML 获取 div 元素，并将其内容更改为 <strong>内容已经被改变了！</strong>。
这样可以动态地更新网页中的内容，而无需重新加载页面。

上一篇：html下拉框

下一篇：html首行缩进2字符代码