ajax中如何实现innerHTML中javascript的运行
2008-02-23 09:14:41来源：互联网 阅读 ()
在参考前人的一些做法后,采用了一些变通方式,和添加一些额外标记,来较好的实现innerHTML中JavaScript的运行,从而使的页面各个模块间更
好的交互,和数据共享.
先看下面的例子:
<html>
<head>
</head>
<script>
var title = "hello";
var time = 0;
var author = "vickenyang";
var email = "ycg01@software.nju.edu.cn";
</script>
<body>
<div id="div_1">
<SPAN style="display: none">hidden</SPAN>
hehe
<!--bs-->
<script>
document.write("first");
</script>
<!--es-->
这是第一个页面!
<br>
<!--bs-->
<script>
time ;
document.write(title time author);
//alert(time);
document.write("<br>---------------");
</script>
<!--es-->
<input type="text" name="test" value="test">
</div>
<script>
function refreshDiv(div)
{
var html = "";
function changediv()
{
var oldwrite = document.write;
var oldwriteln = document.writeln;
document.write = function(str)
{
html = str;
}
document.writeln = function (str)
{
html = str "\n";
}
var htmlTmp = div.innerHTML;
//ie默认大写,添加为支持firefox,美中不足,会替换所有script值,如果只是ie应用,可注销此行
htmlTmp = htmlTmp.replace(/script/gi,"SCRIPT");
//alert(htmlTmp);
var pos_1 = 0;
var pos_2 = 0;
pos_1 = htmlTmp.indexOf("<SCRIPT>",pos_1);
while(pos_1 != -1)
{
html = htmlTmp.substring(pos_2,pos_1);
var pos_3 = htmlTmp.indexOf("</SCR" "IPT>",pos_1);
html = htmlTmp.substring(pos_1,pos_3 "<-SCRIPT>".length);
pos_2 = pos_1 "<SCRIPT>".length;
eval(htmlTmp.substring(pos_2,pos_3));
pos_2 = htmlTmp.indexOf("<!--es-->",pos_3);
pos_1 = htmlTmp.indexOf("<SCRIPT>",pos_1 1);
}
html = htmlTmp.substring(pos_2,htmlTmp.length);
document.write = oldwrite;
document.writeln = oldwriteln;
}
eval("changediv();");
div.innerHTML = html;
}
function change()
{
refreshDiv(document.getElementById('div_1'));
}
function change2()
{
document.write("over");
}
</script>
<input type="button" value="change" onclick="change();">
<input type="button" value="change2" onclick="change2();">
</body>
</html>
步骤:
1.在div的第一行加上<SPAN style="display: none">hidden</SPAN>(不这么做,ie会忽略首位的js)
2.在div中每一个js的前后加上<!--bs--><!--es-->标记.
原理:代码会告诉你的.如果你有更好的方法,请邮件联系,共同探讨.
补:
function refreshDiv(div)
{
var html = "";
如果在特殊的应用中用到递归调用,可以将此处的html 定义为全局变量,这样,保证递归刷新时候,显示的是最后一个页面.(如,你想在ajax中,异步load数据,在回调函数中指定刷新div的时候就可能用到)
下面的例子中有具体的应用:一个基于ajax的,个性网页构建雏形
http://bbs.nju.edu.cn/file/Y/ycg/obj.rar
上一篇： 利用Javascript 与 VBscript 在asp中实现图片自动切换
下一篇： 一种常用的权限控制算法的实现
标签：
版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有
IDC资讯： 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营： 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程： Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术： Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧： 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作： FrontPages Dreamweaver Javascript css photoshop fireworks Flash
