emu in blogjava

            BlogJava :: 首頁 :: 新隨筆 :: 聯(lián)系 :: 聚合  :: 管理 ::
            171 隨筆 :: 103 文章 :: 1052 評論 :: 2 Trackbacks

          在上一篇《Ajax裸奔》中,我們定義了如此一個(gè)xml文件:

          news.xml:

           

          <?xml version="1.0" encoding="gb2312"?>
          <data>
           焦點(diǎn)|工行小額賬戶明年收費(fèi) 不足300元要?dú)w并
          &lt;br /&gt;
           財(cái)經(jīng)|
          &quot;神六&quot;飛行開銷僅為美航天飛機(jī)4.5% 花9億&lt;br /&gt;
           財(cái)經(jīng)|2005能源富豪榜揭榜 超市要撤致癌保鮮膜
          &lt;br /&gt;
           證券|神六催生高價(jià)股 MBO公司股改 高管一夜暴富
          &lt;br /&gt;
           證券|保險(xiǎn)公司告基金利益輸送 科龍管理班子亮相 
          &lt;br /&gt;
           科技|神六飛船成功著陸 載人飛行取得圓滿成功
          &lt;br /&gt;
           關(guān)注|索尼中國不裁員 夏普與南京熊貓分道揚(yáng)鑣 
          &lt;br /&gt;
           熱點(diǎn)|北電任命新總裁兼CEO 索愛發(fā)布第三季財(cái)報(bào)
          &lt;br /&gt;
           數(shù)碼|300萬像素手機(jī)推薦 最有降價(jià)潛力手機(jī)導(dǎo)購
          &lt;br /&gt;
           測評|近期五大DC跳水王 怪模怪樣個(gè)性手機(jī)推薦
          &lt;br /&gt;
           探索|亞歷山大古城的文化歷史 勝利者改寫歷史 
          &lt;br /&gt;
          </data>

           

          這確確實(shí)實(shí)是一個(gè)合法的xml文件,但是不是一個(gè)漂亮的xml文件。xml語言的一個(gè)巨大的優(yōu)勢是自說明性。上面這個(gè)xml語言只說明了一件事:我有一堆數(shù)據(jù)(data標(biāo)記),大家拿去用阿。可是怎么用呢,只能靠約定了。
          一個(gè)漂亮一點(diǎn)的xml應(yīng)該像這樣:

          news2.xml:

          <?xml version="1.0" encoding="gb2312"?>
          <newsList>
           
          <title type="焦點(diǎn)">工行小額賬戶明年收費(fèi) 不足300元要?dú)w并</title>
           
          <title type="財(cái)經(jīng)">&quot;神六&quot;飛行開銷僅為美航天飛機(jī)4.5% 花9億</title>
           
          <title type="財(cái)經(jīng)">2005能源富豪榜揭榜 超市要撤致癌保鮮膜</title>
           
          <title type="證券">神六催生高價(jià)股 MBO公司股改 高管一夜暴富</title>
           
          <title type="證券">保險(xiǎn)公司告基金利益輸送 科龍管理班子亮相</title>
           
          <title type="科技">神六飛船成功著陸 載人飛行取得圓滿成功</title>
           
          <title type="關(guān)注">索尼中國不裁員 夏普與南京熊貓分道揚(yáng)鑣</title>
           
          <title type="熱點(diǎn)">北電任命新總裁兼CEO 索愛發(fā)布第三季財(cái)報(bào)</title>
           
          <title type="數(shù)碼">300萬像素手機(jī)推薦 最有降價(jià)潛力手機(jī)導(dǎo)購</title>
           
          <title type="測評">近期五大DC跳水王 怪模怪樣個(gè)性手機(jī)推薦</title>
           
          <title type="探索">亞歷山大古城的文化歷史 勝利者改寫歷史 </title>
          </newsList>

          這個(gè)xml非常好的說明了所有的事情:xml的內(nèi)容是新聞標(biāo)題,每個(gè)標(biāo)題的分類是什么,標(biāo)題內(nèi)容是什么,一目了然,甚至一個(gè)不懂中文的程序員也可以從xml標(biāo)記和層次中了解到這些信息,不需要多余的猜測和約定。

          第一種方式,我通常稱之為AJaH(Asynchronous Javascript and Hyper-text),第二種,我才稱為真正的Ajax。

          開發(fā)Ajax應(yīng)用中,我們經(jīng)常要面臨的一個(gè)選擇就是,用上面AJaH的方式還是下面Ajax的方式來組織數(shù)據(jù)。這并不是可以簡單的一刀切的問題,很大程度上取決于開發(fā)者對各方面優(yōu)劣的取舍。我在這里只把兩者的優(yōu)劣大概的列一下。
          1 Ajax比較好聽,有個(gè)球隊(duì)叫阿賈克斯的就是這么拼的,AjaH就不知道要怎么念才好聽了:)
          2 AjaH解析起來更容易更快。按照約定包裝好的數(shù)據(jù)只需要最少的加工就可以使用了,按照規(guī)范形式包裝的數(shù)據(jù)需要相對復(fù)雜的解析過程
          3 Ajax更加通用。用Ajax我們很容易就可以吧同一個(gè)CGI(廣義的cgi)生成的xml數(shù)據(jù)使用在任何不同的場合,而不需要后臺服務(wù)程序做出任何修改,用AjaH的話就很可能需要為相同的數(shù)據(jù)做出不同的版本。
          4 AjaX更不容易出錯,需要的時(shí)候我們可以建立DTD或者xmlschema來自動校驗(yàn)xml數(shù)據(jù)的正確性,二AjaH的正確性則需要手工驗(yàn)證來保障。
          5 Ajax更容易維護(hù)和修改。AjaH的數(shù)據(jù)中往往整合了html/css美工效果和上下文相關(guān)的javascript代碼,混合編碼造成了代碼維護(hù)的代價(jià)比較高。

          作為對比,我們試試解析新的news2.xml文件來生成頁面:

          betterAjax.html:
          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
          <html>
          <head>
           
          <meta http-equiv="Content-Type" content="text/html; charset=gb18030" />
           
          <meta name="Author" content="emu" />
           
          <meta name="Keywords" content="ajax" />
           
          <title> 更好的Ajax例子 </title>
           
          <script type="text/JavaScript">
           
          <!--
           
          var newsXML;
           
          function init(){
            newsXML 
          = window.XMLHttpRequest?(new XMLHttpRequest()):(new ActiveXObject("Microsoft.XMLHTTP"));
            newsXML.onreadystatechange
          = handleXML;
            newsXML.open(
          "GET","news2.xml",true);
            newsXML.send(
          null);
           }
           
          function handleXML(){
            
          if(newsXML.readyState==4){
             
          var titleList = newsXML.responseXML.getElementsByTagName("title");
             
          var st = "";
             
          for(var i=0;i<titleList.length;i++){
              x 
          = titleList[i];
              st 
          += x.getAttribute("type")+"|"+(x.text?x.text:x.textContent)+"<br />";
             }
             document.body.innerHTML
          =st;
            }
           }
           
          //-->
           </script>
          </head>
          <body onload="init()">
          </body>
          </html>

           

          其實(shí)做起來也很容易,對不對?把這個(gè)頁面和前面的news2.xml放到同一個(gè)目錄下發(fā)布即可運(yùn)行。

          本文全部原碼下載

          posted on 2006-01-26 17:00 emu 閱讀(1996) 評論(10)  編輯  收藏

          評論

          # re: Ajax還是Ajah,這是個(gè)問題 2006-02-02 14:50
          為何我無法運(yùn)行成功?
          emu能否再測試一下?

          就是setp7,還有betterAjax文件

          step7的提示
          Line:21
          Char:4
          Code:0
          Error:Object required
          URL:file://C:\Documents and Settings\Jay-DotKu\My Documents\work\ajax\Ajax01\step7.html

          betterAjax則是沒有反應(yīng)  回復(fù)  更多評論
            

          # re: Ajax還是Ajah,這是個(gè)問題 2006-02-02 15:40 emu
          因?yàn)槟銢]有把文件用一個(gè)http服務(wù)器發(fā)布出來。
          xmlhttprequest不能訪問本地文件系統(tǒng),需要建立http連接才可以。  回復(fù)  更多評論
            

          # re: Ajax還是Ajah,這是個(gè)問題 2006-02-03 15:01 dingsea
          好文啊,黃老大!
          標(biāo)記一下。
            回復(fù)  更多評論
            

          # re: Ajax還是Ajah,這是個(gè)問題 2006-03-17 09:25 tonghu006
          你好,emu,你的這個(gè)例子我把它放到IIS中運(yùn)行怎么運(yùn)行不出結(jié)果來呢,betterajax.html和step7.html  回復(fù)  更多評論
            

          # re: Ajax還是Ajah,這是個(gè)問題 2006-03-17 09:30 tonghu006
          betterajax.html這個(gè)不能運(yùn)行出效果來,step7.htm現(xiàn)在可以在iis中運(yùn)行
            回復(fù)  更多評論
            

          # re: Ajax還是Ajah,這是個(gè)問題 2006-03-17 14:33 emu
          呵呵,我不知道。遇到問題要自己調(diào)試。  回復(fù)  更多評論
            

          # re: Ajax還是Ajah,這是個(gè)問題 2006-05-11 10:26 worldlover
          betterajax.html這個(gè)文件運(yùn)行后沒有任何效果,也沒有提示錯誤,這是怎么會事呀????  回復(fù)  更多評論
            

          # re: Ajax還是Ajah,這是個(gè)問題 2006-05-22 10:34 tonghu008
          請教一個(gè)問題,我用ajax,在服務(wù)器的后臺中我用一個(gè)循環(huán)送出xml,那么我在客戶端接受xml的時(shí)候是不是還是要循環(huán)接受呢?要是用循環(huán)來實(shí)現(xiàn)好象不行,怎么才能接受服務(wù)器端循環(huán)送出的xml文檔呢?請指教指教,謝謝!  回復(fù)  更多評論
            

          # re: Ajax還是Ajah,這是個(gè)問題 2006-07-14 10:13 aoyuxuan
          emu,你的文章太帥了。我一直都在為怎么在多瀏覽器讀取xml發(fā)愁呢。我是初學(xué)者,所以有些糊涂,但是你的文章后,猶如醍醐灌頂阿。好文,言簡意賅。^_^
          我還有一個(gè)問題,關(guān)于xml讀取后,做了一個(gè)超鏈接。
          怎么樣能做到,點(diǎn)擊超鏈接后傳到一個(gè)頁面后,在另一個(gè)頁面實(shí)現(xiàn)根據(jù)傳得參數(shù)調(diào)取相應(yīng)的數(shù)據(jù)。
          就像使用asp,php那樣,例 發(fā)出頁面 http://xxx.asp?title=xxx
          接受頁面 http://yyy.asp
          接受后,根據(jù)xxx調(diào)出相應(yīng)的內(nèi)容。
          用aJax 怎么作?  回復(fù)  更多評論
            

          # re: Ajax還是Ajah,這是個(gè)問題 2006-07-15 14:34 emu
          這個(gè)跟ajax沒用關(guān)系了,在yyy.asp上可一通過referrer獲得發(fā)出頁面的地址信息來分析(在服務(wù)器端和瀏覽器端獲得的方式有點(diǎn)區(qū)別),不過更好的做法應(yīng)該是顯式的傳遞參數(shù):
          http://yyy.asp?title=xxx  回復(fù)  更多評論
            


          只有注冊用戶登錄后才能發(fā)表評論。


          網(wǎng)站導(dǎo)航:
           
          主站蜘蛛池模板: 浮梁县| 黑河市| 新平| 太仓市| 当雄县| 汪清县| 莱芜市| 台前县| 惠水县| 平顺县| 巴彦淖尔市| 桂东县| 富阳市| 嵊州市| 宝清县| 金寨县| 威宁| 苍梧县| 福州市| 运城市| 西昌市| 苏尼特右旗| 清涧县| 中江县| 应用必备| 寻乌县| 贵定县| 大丰市| 田阳县| 镇安县| 泽普县| 屯留县| 九台市| 鱼台县| 深圳市| 富宁县| 荣昌县| 江陵县| 通辽市| 四平市| 中超|