javascript跨域刷新实现代码

  三个页在同一个窗口,分别为main.htm,left.htm和right.htm。

  main.htm

  

复制代码 代码如下:

  <html>

  <head>

  <title>实现跨</title>

  </head>

  <body>

  <div>主窗口</div>

  <iframe id="left" name="left" width="500px" height="300px;" src="left.htm" ></iframe>

  <iframe id="right" name="right" width="100px" height="100px;" src="right.htm" ></iframe>

  </body>

  </html>

  left.htm

  

复制代码 代码如下:

  <html>

  <head><title>左边</title></head>

  <body>

  <div>我是左边</div>

  <div><img src="http://www.enjoymyself.info/images/buysc.jpg" alt=" " /></div>

  </body>

  </html>

  right.htm

  

复制代码 代码如下:

  <html>

  <head><title>右边</title></head>

  <body>

  <div>

  <input onclick="onclickRefresh();" type="button" value="提交" /></div>

  <script type="text/javascript">

  function onclickRefresh()

  {

  parent.frames[ "left"].location.reload();

  //window.left.location.reload();

  }

  </script>

  </body>

  </html>

  看到right.htm里面

  function onclickRefresh()通过 parent.frames["left"].location.refresh();来实现右边页面刷新左边页面.

  如果在主页面加

  

复制代码 代码如下:

  <div><input type="button" onclick="mainRefresh();" value="主提交" /></div>

  <script type="text/javascript">

  function mainRefresh()

  {

  window.left.location.reload();

  }

  </script>

  则可以通过主页面刷新子页面。

  虽然这样可以超级简单的实现的目的,但是实际项目中,数据不会是这么简单的,最常见是左\右树,目录树的创建加载(如创建一千个节点)本来就是比较耗资源。如果还是通过方式来刷新左右页面,效率之低可见而知,那么是不是可以通过其他方式来实现跨域刷新或者提交呢?

  我所想到的是通过ajax实现数据局部加载。而不是整个树的加载。另外通过jquery的json处理方式也可实现局部数据的更新。

  不知道还有没有其他更高效的方法?1000个节点的树加载,效率值得思考的问题。