魚躍于淵

          First know how, Second know why !
          posts - 0, comments - 1, trackbacks - 0, articles - 49

          ajax 做圖片幻燈片

          Posted on 2008-09-24 16:01 魚躍于淵 閱讀(387) 評論(1)  編輯  收藏 所屬分類: 平時小練習

          <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
          <html>
          <head>
          <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
          <title>Insert title here</title>

          <script type="text/javascript">
           
           window.onload=initAll ;
           var xhr = false ;
           var url = "ajax02.xml" ;
           
           function initAll(){
            if(window.XMLHttpRequest){
            xhr = new XMLHttpRequest() ;
            }else{
             if(window.ActiveXObject){
              try{
               xhr = new ActiveXObject("Microsoft.XMLHttpRequest") ;
              }catch(e){}
             }
            }
            if(xhr){
             xhr.onreadystatechange = showContents ;
             xhr.open("GET", url, true) ;
             xhr.send(null) ;
            }else{
             document.getElementById("updateArea").innerHTML = "sorry ! but your pc coundn't create a xhr object !" ;
            }
            
            setTimeout("initAll()", 500) ;
           }
           
           function showContents(){
            if(xhr.readyState == 4){
             if(xhr.status == 200){
              var tempDiv = document.createElement("div") ;
              var imgDiv = document.getElementById("imgDiv") ;
              tempDiv.innerHTML = xhr.responseText ;
              var allLinks = tempDiv.getElementsByTagName("a") ;
              //alert(allLinks.length) ;
              for(i=0; i<allLinks.length; i++){
               //imgDiv.appendChild(allLinks[i].cloneNode(true)) ;
               //var br = document.createElement("br") ;
               //imgDiv.appendChild(br) ;
              }
              var imgid = Math.floor(Math.random() * allLinks.length) ;
              document.getElementById("imgDiv").innerHTML = allLinks[imgid].innerHTML ;
              
             }else{
              var outMsg = "there was a problem on your server : status = " + status ;
             }
            }
           }

          </script>

          </head>
          <body>
          <center>
           <div id="imgDiv"></div>
          </center>
          </body>
          </html>

          XML 文件為 :

          <?xml version="1.0" encoding="UTF-8"?>
          <author>
           <entry>
            <a href="jason1"><img width="100" height="100" border="0" src="images/1.jpg" /></a>
           </entry>
           <entry>
            <a href="jason1"><img width="100" height="100" border="0"  src="images/2.jpg" /></a>
           </entry>
           <entry>
            <a href="jason1"><img width="100" height="100" border="0" src="images/3.jpg" /></a>
           </entry>
           <entry>
            <a href="jason1"><img width="100" height="100" border="0" src="images/4.jpg" /></a>
           </entry>
           <entry>
            <a href="jason1"><img width="100" height="100" border="0" src="images/5.jpg" /></a>
           </entry>
          </author>

          Feedback

          # re: ajax 做圖片幻燈片[未登錄]  回復  更多評論   

          2009-02-16 12:43 by ^_^
          NICE

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


          網(wǎng)站導航:
           
          主站蜘蛛池模板: 红河县| 东明县| 汤阴县| 阳泉市| 沙田区| 滦南县| 青海省| 凤翔县| 肥乡县| 高青县| 南部县| 子长县| 镇雄县| 德令哈市| 泰安市| 双峰县| 治多县| 九台市| 辽阳县| 弋阳县| 南京市| 侯马市| 克拉玛依市| 黄梅县| 云霄县| 正镶白旗| 二连浩特市| 永济市| 永登县| 莒南县| 南投县| 远安县| 鸡东县| 罗江县| 泰兴市| 毕节市| 类乌齐县| 萝北县| 启东市| 于都县| 仁化县|