javascript跨域刷新实现代码


Posted in Javascript onJanuary 01, 2011

三个页在同一个窗口,分别为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个节点的树加载,效率值得思考的问题。
Javascript 相关文章推荐
跨域请求之jQuery的ajax jsonp的使用解惑
Oct 09 Javascript
jQuery图片播放8款精美插件分享
Feb 17 Javascript
jQuery使用技巧简单汇总
Apr 18 Javascript
倒记时60刷新网页的js代码
Feb 18 Javascript
javascript实现 百度翻译 可折叠的分享按钮列表
Mar 12 Javascript
js ajaxfileupload.js上传报错的解决方法
May 05 Javascript
JS获取IE版本号与HTML设置IE文档模式的方法
Oct 09 Javascript
BootStrap 图片样式、辅助类样式和CSS组件的实例详解
Jan 20 Javascript
jQury Ajax使用Token验证身份实例代码
Sep 22 Javascript
vuejs 切换导航条高亮(路由菜单高亮)的方法示例
May 29 Javascript
React实现全局组件的Toast轻提示效果
Sep 21 Javascript
JS函数节流和防抖之间的区分和实现详解
Jan 11 Javascript
extjs中grid中嵌入动态combobox的应用
Jan 01 #Javascript
js注意img图片的onerror事件的分析
Jan 01 #Javascript
JavaScript 计算图片加载数量的代码
Jan 01 #Javascript
jQuery jqgrid 对含特殊字符json 数据的 Java 处理方法
Jan 01 #Javascript
基于jQuery架构javascript基础体系
Jan 01 #Javascript
jQuery技巧总结
Jan 01 #Javascript
js中查找最近的共有祖先元素的实现代码
Dec 30 #Javascript
You might like
JAVA/JSP学习系列之二
2006/10/09 PHP
php文件缓存类汇总
2014/11/21 PHP
php+mysql+ajax实现单表多字段多关键词查询的方法
2017/04/15 PHP
Yii框架的redis命令使用方法简单示例
2019/10/15 PHP
Javascript操纵Cookie实现购物车程序
2006/11/23 Javascript
addRule在firefox下的兼容写法
2006/11/30 Javascript
jquery实现的让超出显示范围外的导航自动固定屏幕最顶上
2011/09/22 Javascript
JS解决ie6下png透明的方法实例
2013/08/02 Javascript
js向上无缝滚动,网站公告效果 具体代码
2013/11/18 Javascript
在firefox和Chrome下关闭浏览器窗口无效的解决方法
2014/01/16 Javascript
PHP+MySQL+jQuery随意拖动层并即时保存拖动位置实例讲解
2015/10/09 Javascript
原生JS封装Ajax插件(同域、jsonp跨域)
2016/05/03 Javascript
js仿QQ邮箱收件人选择与搜索功能
2017/02/10 Javascript
Vue.js展示AJAX数据简单示例讲解
2017/03/29 Javascript
通过命令行生成vue项目框架的方法
2017/07/12 Javascript
快速了解Node中的Stream流是什么
2019/02/13 Javascript
AntV F2和vue-cli构建移动端可视化视图过程详解
2019/10/08 Javascript
vue项目前端微信JSAPI与外部H5支付相关实现过程及常见问题
2020/04/14 Javascript
在vue中使用Echarts画曲线图的示例
2020/10/03 Javascript
原生JavaScript实现五子棋游戏
2020/11/09 Javascript
[02:19]DOTA选手解说齐贺岁
2018/02/11 DOTA
零基础写python爬虫之使用urllib2组件抓取网页内容
2014/11/04 Python
浅谈Python中列表生成式和生成器的区别
2015/08/03 Python
pandas 对series和dataframe进行排序的实例
2018/06/09 Python
python3利用tcp实现文件夹远程传输
2018/07/28 Python
Python tkinter 下拉日历控件代码
2020/03/04 Python
CSS3哪些新特性值得称赞
2016/03/02 HTML / CSS
CSS3实现苹果手机解锁的字体闪亮效果示例
2021/01/05 HTML / CSS
BOSE德国官网:尽探索之力,享音乐之极
2016/12/11 全球购物
大学生应聘自荐信
2013/10/11 职场文书
体育教育专业自荐信范文
2013/12/20 职场文书
2014年维稳工作总结
2014/11/18 职场文书
营业员岗位职责
2015/02/11 职场文书
关于环保的广播稿
2015/12/17 职场文书
Oracle安装TNS_ADMIN环境变量设置参考
2021/11/01 Oracle
python数字图像处理之对比度与亮度调整示例
2022/06/28 Python