无为清净楼资源网 Design By www.qnjia.com
其实标题只是一个噱头罢了,只是想谈一下,Javascript 与 Actionscript 是如何操作XML的。
希望能帮助一些只用 Javascript 或 只懂 Actionscript 的朋友,了解两者的相同与不同之处。
Flash 与 后台连接有许多种,Actionscript 调用 XML() 算是比较简单的一种了,
而Javascript 调用 xmlHttp ,便形成了现在很流行的Ajax了。
现在就用一个网上常出现的分页效果来对 Flash 和 Ajax 做个入门学习。
效果预览
源文件下截
source.rar
实际运用中一般是通过后台脚本生成XML文件,再对其产生的数据进行操作
由于篇幅关系在本文中将用1.xml 2.xml 3.xml代替。后台脚本不做说明
首先了解一个XML的结构:
复制代码 代码如下:
<data>
<movie id="1" type="爱情">幸福终点站</movie>
<movie id="2" type="恐怖">绝命终结站</movie>
<movie id="3" type="喜剧">恐怖电影</movie>
…
….
</data>
从简单的Flash开始吧
复制代码 代码如下:
function setxml(page){
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了
关于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–) //要删除原来有的行,不然表格会无限延伸
table.deleteRow(i);
xmlroot = xmlHttp.responseXML.getElementsByTagName("movie"); //取得XML所需要的根
for (i=0;i<xmlroot.length;i++)
{
//简单的DOM,生成表格。
tr = table.insertRow(-1);
td = tr.insertCell(-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;
}
}
希望能帮助一些只用 Javascript 或 只懂 Actionscript 的朋友,了解两者的相同与不同之处。
Flash 与 后台连接有许多种,Actionscript 调用 XML() 算是比较简单的一种了,
而Javascript 调用 xmlHttp ,便形成了现在很流行的Ajax了。
现在就用一个网上常出现的分页效果来对 Flash 和 Ajax 做个入门学习。
效果预览
源文件下截
source.rar
实际运用中一般是通过后台脚本生成XML文件,再对其产生的数据进行操作
由于篇幅关系在本文中将用1.xml 2.xml 3.xml代替。后台脚本不做说明
首先了解一个XML的结构:
复制代码 代码如下:
<data>
<movie id="1" type="爱情">幸福终点站</movie>
<movie id="2" type="恐怖">绝命终结站</movie>
<movie id="3" type="喜剧">恐怖电影</movie>
…
….
</data>
从简单的Flash开始吧
复制代码 代码如下:
function setxml(page){
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了
关于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–) //要删除原来有的行,不然表格会无限延伸
table.deleteRow(i);
xmlroot = xmlHttp.responseXML.getElementsByTagName("movie"); //取得XML所需要的根
for (i=0;i<xmlroot.length;i++)
{
//简单的DOM,生成表格。
tr = table.insertRow(-1);
td = tr.insertCell(-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;
}
}
无为清净楼资源网 Design By www.qnjia.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
无为清净楼资源网 Design By www.qnjia.com
暂无评论...
更新日志
2024年11月15日
2024年11月15日
- 黄乙玲1988-无稳定的爱心肝乱糟糟[日本东芝1M版][WAV+CUE]
- 群星《我们的歌第六季 第3期》[320K/MP3][70.68MB]
- 群星《我们的歌第六季 第3期》[FLAC/分轨][369.48MB]
- 群星《燃!沙排少女 影视原声带》[320K/MP3][175.61MB]
- 乱斗海盗瞎6胜卡组推荐一览 深暗领域乱斗海盗瞎卡组分享
- 炉石传说乱斗6胜卡组分享一览 深暗领域乱斗6胜卡组代码推荐
- 炉石传说乱斗本周卡组合集 乱斗模式卡组最新推荐
- 佟妍.2015-七窍玲珑心【万马旦】【WAV+CUE】
- 叶振棠陈晓慧.1986-龙的心·俘虏你(2006复黑限量版)【永恒】【WAV+CUE】
- 陈慧琳.1998-爱我不爱(国)【福茂】【WAV+CUE】
- 咪咕快游豪礼放送,百元京东卡、海量欢乐豆就在咪咕咪粉节!
- 双11百吋大屏焕新“热”,海信AI画质电视成最大赢家
- 海信电视E8N Ultra:真正的百吋,不止是大!
- 曾庆瑜1990-曾庆瑜历年精选[派森][WAV+CUE]
- 叶玉卿1999-深情之选[飞图][WAV+CUE]