最近在一間小公司實習，寫一些小東西。小公司嘛，人們都說在小公司要什麼都寫的。果真是。
前端，後台，無論是HTML,CSS,JavaScript還是XML，Java，都要自己全包了。還好前台的要求不高。寫一些芝麻豆腐的東西還是不在話下的。但是整個項目下來估計還不止這些要寫。而且我的經驗當中，都沒怎麼關心過前端的東西，一直認為這是和我無關的東西，這次估計要悲劇了。所以找了一本書來看——《Ajax實戰》。臨時抱佛腳，臨陣磨槍，也不能說是完全沒有用處的。相比沒怎麼寫過Java的人，我還是覺得寫一些簡單的Javascript對背景協助比我去寫Java要快。而且互動上來說，Ajax也是必須的。我本人也討厭老是要重新整理整個頁面，這太影響體驗了。
Ajax，至於叫什麼，大家隨意吧。是人也好，是足球隊也罷。。。
Ajax不是單一的技術，大家都知道，好吧，我囉嗦了。
Ajax設計的技術：Javascript，CSS，DOM，XMLHttpRequest對象。
Javascript和CSS，這兩種技術，之前也寫過，所以有所瞭解。一直覺得DOM很難理解，主要還是自己懶一直沒有自己去看。XMLHttpRequest嘛，無非就是跟伺服器打交道的東西。Request，請求嘛。
用Javascript改善使用者體驗。用CSS定義應用的外觀。用DOM組織視圖。使用XML技術非同步載入資料。簡單來說，Ajax就做了這些事情吧。
暫時只想說個Javascript操作CSS和DOM的例子，XML的事情以後再說吧。一步一步來。
一個簡單的例子：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Hello Ajax</title>
<style type="text/css">
.news{
color:#FF0000;
font-family:"微軟雅黑";
font-size:14px;
font-weight:normal;
}
.more{
color:#0000FF;
font-family:"宋體";
font-size:150px;
font-weight:bold;
height:200px;
width:200px;
line-height:200px;
text-align:center;
border:solid green 2px;
float:left;
margin:10px;
}
</style>
<script type="text/javascript">
// JavaScript Document
var data="屌絲們4月1日節日快樂啊";
window.onload=function(){
var hello=document.getElementById('hello');
hello.className='news';
}
function more(){
var empty=document.getElementById('empty');
for(var i=0;i<data.length;i++){
addNode(empty,data[i]);
}
var children=empty.childNodes;
for(var i=0;i<children.length;i++){
children[i].className='more';
}
}
function addNode(el,text){
var childEl=document.createElement("div");
el.appendChild(childEl);
var txtNode=document.createTextNode(text);
childEl.appendChild(txtNode);
}
</script>
</head>
<body>
<p id="hello">新聞訊息：部落格園收購了CSDN</p>
<a href="javascript:;" onclick="more()">更多內容</a>
<div id="empty"></div>
</body>
</html>
javascript蠻好玩的嘛。
執行個體：愚人節版
這是一個用javascript操作Document和CSS的例子。
譬如（方法1）DOM能夠為javascript引擎公開網頁。通過DOM，可以採用編程的方式操作文檔的結構。Web頁面的DOM表示是一個樹狀結構，由元素或點組成。節點可以包含很多子節點。javascript通過全域變數document公開當前Web葉夢得根節點，這個變數是所有DOM操作的起點。DOM使用容器的屬性來做索引，而不是使用數字做索引。DOM中元素的關係可以看作是HTML清單的鏡像。這種關係可以是雙向的，修改DOM將改變HTML標記，隨之會反映在頁面的現實上。
var node=document.form1.hello;
就可以在javascript中訪問到
<p id="hello">新聞訊息：部落格園收購了CSDN</p>
這個節點。
此外javascript訪問節點還有另外一種方法。
var node=document.getElementById('hello');
這種方式同樣能夠訪問到節點
<p id="hello">新聞訊息：部落格園收購了CSDN</p>其實還有方法的，就是用這種的比較少。
var node=document.getElementByTagName('a');
這種方法會在DOM中搜尋所有的<a>標籤。在大量操作的時候就很有用了。
標題有點大，但卻是在看。。。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
