您的位置：首页 > 其它

W3C对象模型方法

2007-10-15 14:18 931 查看
<li>* 在HTML中，网页中的每一对标记就是一个元素对象，例如，<p></p>、<div></div>、 <table></table>等。为得到网页中的对象，可先将每一个标记赋值为一个惟一的id，例如，<p id="block1"></p>、<div id="titleBar"></div>等。

<li>* 通过对对象id的引用，就可以使用“document.getElementById（元素标识）”方法得到所需的方法。

<li>* W3C文档对象模型将网页结构作为树状节点处理，每一个节点代表网页中的一个元素，对应于HTML文件中的一对标记。因此，当通过id得到某一节点的元素对象后，就可以通过节点方便地得到与其相关的其他网页对象。

<li>* 通过W3C文档对象模型方法改变网页内容的步骤如下：通过节点对象的nodeValue方法得到网页中节点处网页元素对象的内容；通过文档对象的 creatElement方法或creatTextNode方法新建节点元素对象；通过节点对象的appendChild方法添加节点；通过节点对象的 replaceNode方法改变节点内容
<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>W3C对象模型方法</title>

<script language="JavaScript">

<!--

function display() //函数：显示内容

{ //定义节点

var titleTextNode = document.getElementById('titleBar').firstChild;

var title = titleTextNode.nodeValue; //定义节点内容

alert(title); //显示输出

}

function change() //函数：修改内容

{

//定义节点

var newTextNode = document.createTextNode('这是改变后的标题');

var titleNode = document.getElementById('titleBar'); //定义节点内容

var titleTextNode = document.getElementById('titleBar').firstChild;

titleNode.replaceChild(newTextNode,titleTextNode); //替换

}

//-->

</script>

</head>

<body bgcolor="#ffc0c0">

<h2>W3C对象模型方法</h2><hr>

<h1 id="titleBar">这是一个测试标题</h1>

<div style="margin-top:10px;">

<!--通过onclick调用display()函数显示网页内容-->

<input type="button" value="显示" onclick="display();">

<!--通过onclick调用change ()函数改变网页内容-->

<input type="button" value="修改" onclick="change()">

</div>

</body>

</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航