Javascript与HTML DOM

首先来说一说HTML DOM：

HTML DOM（文档对象模型）Document Object Model For HTML

HTML DOM中定义了用于HTML的一系列标准的对象，以及访问和处理HTML文档的标准方法。

通过DOM，可以访问所有的HTML的元素（应该就是标签），连同它们所包含的文本和属性。可以对其中的内容进行增删改查的操作。

总的来说，HTML DOM 独立于平台和编程语言。它可以被Javascript,java等使用。

Javascript可以通过操作HTML DOM来创建动态的HTML。

• Javascript可以改变页面中的所有HTML的元素和其属性
• Javascript可以改变页面中的所有CSS样式
• Javascript可以对页面中的所有时间做出反应

Javascript要改变某一个元素就应该先找到这个元素，主要通过三种方式：

• 通过id查找
• 通过标签名查找
• 通过类名查找

通过id查找：（通过类名查找同理，只不过将id换成class）

<p id="info"> bbbbbbbbeautiful!</p>
<script>
x=document.getElementById("info");<!-- 通过id查找到-->
document.write("<p>I am <br>",x.innerHTML,"</p>");<!--以p标签的形式输出(只是中间多了个换行)-->
</script>

通过标签名查找：（得到的是一个集合）

<p> bbbbbbbbeautiful!</p>
<p>hhhhhhandsome!</p>
<script>
x=document.getElementByTagName("p");<!-- 通过id查找到-->
document.write('第一个p标签:',x[0].innerHTML);<!--以p标签的形式输出(只是中间多了个换行)-->
</script>