1.修改 HTML 元素

修改 HTML DOM 意味着许多不同的方面：

• 改变 HTML 内容
• 改变 CSS 样式
• 改变 HTML 属性
• 创建新的 HTML 元素
• 删除已有的 HTML 元素
• 改变事件（处理程序）

  2.创建 HTML 内容

  改变元素内容的最简单的方法是使用 innerHTML 属性。 ```javascript

  Hello World!

段落通过脚本来修改内容。

Hello world!

Hello world!

<a name="yoXHe"></a>
# 4.创建新的 HTML 元素
如需向 HTML DOM 添加新元素，首先必须创建该元素（元素节点），然后把它追加到已有的元素上。
```javascript
<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>
<script>
var para=document.createElement("p");
var node=document.createTextNode("这是一个新段落。");
para.appendChild(node);
var element=document.getElementById("div1");
element.appendChild(para);
</script>

5.使用事件

下面两个例子在按钮被点击时改变 元素的背景色：

<input type="button"
onclick="document.body.style.backgroundColor='lavender';"
value="修改背景颜色">

在本例中，由函数执行相同的代码：

<input type="button" onclick="ChangeBackground()" value="修改背景颜色" />
  <script>
  function ChangeBackground()
  {
    document.body.style.backgroundColor="lavender";
  }
  </script>

下面的例子在按钮被点击时改变

元素的文本：

<input type="button" onclick="ChangeText()" value="修改文本" />
 <p id="p1">Hello world!</p>
<script>
function ChangeText()
{
    document.getElementById("p1").innerHTML="Hello Runoob!";
}
</script>