使用javascript操作DOM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META CONTENT="EditPlus">
<META CONTENT="">
<META CONTENT="">
<META CONTENT="">
</HEAD>
<style language="javascript" type="text/css">
.declared{
color:red;
font-family: arial;
font-weight: normal;
font-size: 16px;
}
.programmed{
color: blue;
font-family: helvetica;
font-size: 10px;
}
</style>
<BODY>
<p >hello</p>
<div ></div>
</BODY>
<script language="javascript">
window.onload=function(){
var hello = document.getElementById('hello');
hello.className='declared';
var empty = document.getElementById('empty');
addNode(empty,"reader of");
addNode(empty,"Ajax in Action!");
var children = empty.childNodes;
for (var i=0;i<children.length;i++){
children[i].className='programmed';
}
empty.style.border = 'solid green 2px';//直接为节点设置样式
empty.style.width = '200px';
}
var childEl = document.createElement("div");//创建新元素
el.appendChild(childEl);
var txtNode = document.createTextNode(text); //创建文本元素
childEl.appendChild(txtNode);
}
</script>
</HTML>