Ajax从零开始(1)

<style type="text/css"> .code{background-color: #CCCCCC;} .title{font: blod;} </style> 等了N个月终于有机会看到Ajax In Action纯英文版，于是忽冲冲下载制定了1个月的学习计划。

由于之前对此有些了解，比如必备的XHTML+CSS都已经烂熟了，其次对于XMLHTTP、M.XmlHttp几个对象也有接触。




--------------------------------------------------------------------------------



由此，我的Ajax学习之路从这里展开......

一个Ajax Hello World事例:

test.html

《html》
《head》
《link rel='stylesheet' type='text/css'
href='hello.css' /》
《script type='text/javascript'
src='hello.js'》《/script》
《/head》
《body》
《p id='hello'》hello《/p》
《div id='empty'》《/div》
《/body》

hello.css

.declared{
color: red;
font-family: arial;
font-weight: normal;
font-size: 16px;
}
.programmed{
color: blue;
font-family: helvetica;
font-weight: bold;
font-size: 10px;
}

hello.js

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";
}
function addNode(el,text){
var childEl=document.createElement("div");
el.appendChild(childEl);
var txtNode=document.createTextNode(text);
childEl.appendChild(txtNode);
}