DOM基础（基础操作元素修改内容和样式）
<!DOCTYPE html>
<html>
<head>
<title>DOM 基础操作示例</title>
<script>
function changeContent() {
var element = document.getElementById("content");
element.textContent = "新的内容";
}
function changeStyle() {
var element = document.getElementById("styleExample");
element.style.color = "blue";
element.style.fontSize = "20px";
}
</script>
</head>
<body>
<h1 id="content">原始内容</h1>
<button onclick="changeContent()">修改内容</button>
<p id="styleExample">这是一个文本示例。</p>
<button onclick="changeStyle()">修改样式</button>
</body>
</html>这段代码演示了如何使用JavaScript来修改HTML元素的内容和样式。当用户点击“修改内容”按钮时，会调用changeContent函数，该函数会获取ID为content的元素，并将其文本内容修改为"新的内容"。当用户点击“修改样式”按钮时，会调用changeStyle函数，该函数会获取ID为styleExample的元素，并修改其颜色和字体大小。
评论已关闭