快捷導(dǎo)航

開(kāi)始研究Ajax. 第一天

更新時(shí)間：2006年06月30日 00:00:00 作者：

開(kāi)始研究Ajax. 第一天

首先，我是一個(gè)不適合學(xué)習(xí)程序的人，也不喜歡，因?yàn)槲曳浅ｑR虎，每次都會(huì)寫錯(cuò)很多代碼。不過(guò)出于對(duì)DOM，JS，CSS熱愛(ài)，還是開(kāi)始研究Ajax了。

什么是Ajax?
我答：首先Ajax的四個(gè)組成部分為[XMLHttpRequest]，[Javascript]，[DOM]，[CSS].這四個(gè)東西暫且不多解釋。這四個(gè)東西的作用是 [XMLHttpRequest]負(fù)責(zé)與Web服務(wù)器通信，[Javascript]通過(guò)控制[DOM]來(lái)控制頁(yè)面，[CSS]做頁(yè)面修飾，當(dāng)然也是被控制的對(duì)像。這就是Ajax。我所理解的。

下面是一個(gè)實(shí)例！
Ajax的Hello頁(yè)！ Hello The World！

CODE:

[Copy to clipboard]

<html>
<head>
<title>Hello.the World</title>

<style type="text/css"></style>

<script>
window.onload=function() {
      var hello=document.getElementById('hello');  //通過(guò)ID找到元素
      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';  //直接為節(jié)點(diǎn)設(shè)置樣式
      empty.style.width="200px";
}

function addNode(el,text){
      var childEl=document.createElement("div");  //創(chuàng)建新元素
      el.appendChild(childEl);
      var txtNode=document.createTextNode(text);  //創(chuàng)建文本元素
      childEl.appendChild(txtNode);
}
</script>
</head>
<body>
<p id="hello">Hello</p>
<div id="empty"></div>
</body>
</html>

這個(gè)例子就是通過(guò)Javascript控制DOM，在頁(yè)里面寫內(nèi)容還有就是對(duì)頁(yè)面內(nèi)容用CSS修飾。

相關(guān)文章

Ajax獲取XMLHttp對(duì)象的方法
這篇文章主要介紹了Ajax獲取XMLHttp對(duì)象的方法,涉及JavaScript基于ajax的瀏覽器判定、加載等技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下
2015-12-12
好用的AJAX類代碼分享
好用的AJAX類代碼分享，需要的朋友可以參考下。
2011-11-11
Ajax請(qǐng)求響應(yīng)中用window.open打開(kāi)新窗口被攔截的解決方法
ajax 異步請(qǐng)求成功后需要新開(kāi)窗口打開(kāi) url，使用的是 window.open() 方法，但是會(huì)被瀏覽器給攔截，怎么解決呢，下面小編給大家解答下
2016-08-08
詳解Ajax和form+iframe 實(shí)現(xiàn)文件上傳的方法(兩種方式)
文件上傳功能在項(xiàng)目中經(jīng)常會(huì)用到，本文給大家介紹兩種文件上傳的實(shí)現(xiàn)——Ajax和form+iframe，感興趣的朋友一起學(xué)習(xí)吧
2016-04-04
[asp]天楓AJAX百度音樂(lè)即時(shí)聽(tīng)附下載
[asp]天楓AJAX百度音樂(lè)即時(shí)聽(tīng)附下載...
2007-09-09
往xml中更新節(jié)點(diǎn)的實(shí)例代碼
下面小編就為大家?guī)?lái)一篇往xml中更新節(jié)點(diǎn)的實(shí)例代碼。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-07-07
AjaxFileUpload+Struts2實(shí)現(xiàn)多文件上傳功能
這篇文章主要介紹了AjaxFileUpload+Struts2實(shí)現(xiàn)多文件上傳功能,需要的朋友可以參考下
2017-09-09
Servlet 與 Ajax 交互一直報(bào)status=parsererror的解決辦法
這篇文章主要介紹了Servlet 與 Ajax 交互一直報(bào)status=parsererror的解決辦法,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2017-03-03
本人ajax留言板的源程序不錯(cuò)的應(yīng)用js
本人ajax留言板的源程序不錯(cuò)的應(yīng)用js...
2007-09-09
妙用Ajax技術(shù)實(shí)現(xiàn)局部刷新商品數(shù)量和總價(jià)實(shí)例代碼
這篇文章主要給大家介紹妙用Ajax技術(shù)實(shí)現(xiàn)局部刷新商品數(shù)量和總價(jià)實(shí)例代碼，非常不錯(cuò)，需要的朋友一起看看吧
2016-05-05