JS——HTML 文档对象模型

文档的根元素是<HTML>

<HTML>分为两部分<head>和<body>

<head>里面是<title>和<script>

<body>里面是各个元素 eg:<a>  <p>   <h>等

每个元素可以看作一个对象，具有属性、事件

<html>
    <head>
    <title></title>
    <scrip src=""></src>
    </head>
    <body>
    </body>
</html>

 网页被加载时，浏览器会创建页面的文档对象模型。

JS拥有足够的能力改变HTML中的元素，并对其中的事件做出反应.

为了操作HTML中的元素，需要首先获取HTML中的元素，有以下三种方式：

通过ID获取元素

通过标签名获取元素

通过类名获取元素

<!--通过ID-->
var x=document.getElementById("main");
<!--通过标签名-->
var y=x.getElementsByTagName("p");

 部分事件：

onmouseover

onmouseout

onmousedown

onmouseup

onload      //应该是只适用于body元素

onfocus     //获取焦点时

 

 创建一个新元素的步骤：

var para=document.createElement("p");       //创建新元素

//创建文本节点  并给新创建的元素追加节点

para.appendChild(node);

var node=document.createTextNode("这是新段落。");

//这时只是创建了一个元素，但并没有添加到页面中

//应该首先获取页面中的一个元素  然后在这个元素后面追加新建的元素

var element=document.getElementById("div1");

element.appendChild(para);

 

posted @ 2015-07-06 20:27  沙中世界  阅读(162)  评论(0)    收藏  举报