|
首页 | 名片设计 CorelDRAW Illustrator AuotoCAD Painter 其他软件 Photoshop Fireworks Flash |
|
其实标题只是一个噱头罢了,只是想谈一下,Javascript 与 Actionscript 是如何操作XML的。 希望能帮助一些只用 Javascript 或 只懂 Actionscript 的朋友,了解两者的一样与不同之处。 Flash 与 后台连接有许多种,Actionscript 调用 XML() 算是比较简朴的一种了, 而Javascript 调用 xmlHttp ,便形成了现在很流行的Ajax了。 现在就用一个网上常出现的分页效果来对 Flash 和 Ajax 做个入门学习。 效果预览 源文件下截:点击这里下载源文件 实际运用中一般是通过后台脚本生成XML文件,再对其产生的数据进行操作 由于篇幅关系在本文中将用1.xml 2.xml 3.xml代替。后台脚本不做说明 首先了解一个XML的结构: <data> 从简朴的Flash开始吧 <movie id="1" type="爱情">幸福终点站</movie> <movie id="2" type="恐怖">绝命终结站</movie> <movie id="3" type="喜剧">恐怖电影</movie> … …. </data> function setxml(page){ 接下来是Ajax了 pageXml = new XML(); //申明XML对象 pageXml.ignoreWhite = true; //答应空白 pageXml.load(page+".xml?rid="+Math.random()); //读取XML文件 pageXml.onLoad = function(success) { if (success) { parseXml(pageXml); //假如读取成功,分析XML文件 } } } function parseXml(pageXml){ xmlroot = ageXml.firstChild; //定义XML根目录 for (i=0;i<xmlroot.childNodes.length;i++) { attachMovie("tr","tr_"+i,i); //生成行 this["tr_"+i]._x = 13; this["tr_"+i]._y = 25*i+33; this["tr_"+i].no = xmlroot.childNodes[i].attributes.id; //取得一条记录的ID this["tr_"+i].name = xmlroot.childNodes[i].firstChild; //片名 this["tr_"+i].type = xmlroot.childNodes[i].attributes.type; //类型 page = pageXml.firstChild.attributes.page; //获取当前页 } } if (!page) //初始页码为第一页 page=1; setxml(page); //初始第一页内容 presetxmlbtn.onRelease = function() { setxml(page*1-1) ; //向前翻页,读取内容 } nextbtn.onRelease = function() { setxml(page*1+1); //向后翻页,读取内容 } 关于Ajax 入门学习可以有翻一下我以前的日志,我推荐过两篇不错的文章 var xmlHttp
/* 第一部分是有关xmlHttp的申明,因为IE和其它一些浏览生成xmlHttp的对象有一点两样,所以申明时比较麻烦 其它主要功能相称于Flash方法中的 "new XML()" 当然还包函其它功能 */ function GetXmlHttpObject(handler) { var objXmlHttp=null; if (navigator.userAgent.indexOf("MSIE")>=0) { var strName="Msxml2.XMLHTTP"; if (navigator.appVersion.indexOf("MSIE 5.5")>=0) //既使是IE都有两种申明方法 { strName="Microsoft.XMLHTTP"; } try { objXmlHttp=new ActiveXObject(strName); objXmlHttp.onreadystatechange=handler; return objXmlHttp; } catch(e) { alert("Error. Scripting for ActiveX might be disabled"); return; } } else { objXmlHttp=new XMLHttpRequest(); //Firefox、Opera等都是用这种 objXmlHttp.onload=handler; objXmlHttp.onerror=handler; return objXmlHttp; } } //首先要被调用的函数,可看作上面Flash中的 setxml()函数, function showpage(no) { document.getElementById("loadstatus").innerHTML = "Lading…"; var url = no+".xml?rid="+Math.random(); //stateChanged_showplist是下面的函数名,注重的是不要加括号 xmlHttp=GetXmlHttpObject(stateChanged_showplist); //传递方法是GET,也可以选择POST方法,有时传递变量是中文要记得设置文件头 xmlHttp.open("GET", url , true); xmlHttp.send(null); } //分析XML函数 function stateChanged_showplist() { if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") //xmlHttp.readyState==4 4表示读取结束 { document.getElementById("loadstatus").innerHTML = " "; table = document.getElementById("pagebody"); //生成TALBE Element for (i = table.rows.length-1; i >= 0; i?C) //要删除原来有的行,不然表格会无限延伸 table.deleteRow(i); xmlroot = xmlHttp.responseXML.getElementsByTagName("movie"); //取得XML所需要的根 for (i=0;i<xmlroot.length;i++) { //简朴的DOM,生成表格。 tr = table.insertRow(-1); td = tr.in sertCell(-1); td.align = "center"; td.innerHTML = ‘<span class="warntxt">’+xmlroot[i].getAttribute(’id’)+’</span>’; td = tr.insertCell(-1); td.innerHTML = xmlroot[i].firstChild.data; td = tr.insertCell(-1); td.innerHTML = xmlroot[i].getAttribute(’type’); } //定义翻页链接 page = xmlHttp.responseXML.getElementsByTagName("data")[0].getAttribute(’page’) if (page >1) { prepage = page*1-1; var changpage = "<a href=’javascript:showpage("+ prepage +")’>上一页</a> "; } else { changpage = "上一页 "; } if (page <3) { nextpage = page*1+1; changpage += "<a href=’javascript:showpage("+ nextpage +")’>下一页</a> "; } else{ changpage += "下一页 "; } document.getElementById("changpage").innerHTML = changpage; } } 返回类别: Flash教程 上一教程: 在Flash中实现Winamp均衡器频谱效果 下一教程: Flash制作卫星围绕地球旋转的运动效果 您可以阅读与"Flash & Ajax 操作 XML 实例:无刷新分页"相关的教程: · Flash MX 2004实例制作视频教程:太空战记游戏(4) · Flash MX 2004实例制作视频教程:机器猫动画片头6 · Flash MX 2004实例制作视频教程:五彩苹果(下) · FlashMX 视频教程(27)-实例6制作叶子 · Flash MX 2004实例制作视频教程:手机浮动广告3 |
快精灵印艺坊 版权所有 | 首页会员中心在线印刷在线编辑付款方式索取样品设计指南连锁门店 |