文档章节

跨域加载脚本或页面获取内容

leeldy
 leeldy
发布于 2015/09/16 20:43
字数 345
阅读 269
收藏 16
$.extend({
    /**
    * 跨域装载JS脚本,获取页面窗口对象,从而获得DOM内容
    * @param string url 需要读取的脚本地址
    * @param function callback 回调函数,参数为载入后的窗口win对象
    * @param string charset 指定字符编码
    */
    'crossGetScript':function(url,callback,charset){
        
        if($.isEmptyObject(url) || !$.isFunction(callback)){
            return;
        }
        
        //初始化返回
        if(charset===undefined){
            charset = 'UTF-8';
        }
        
        var id = 'i_'+new Date().getTime();
        
        //装载url数据
        $('<iframe>',{
            'id':id,
            'srcdoc':'<script src="'+url+'" charset="'+charset+'" ></script>',
            'style':'display:none',
            'load':function(){
                var win = $(this)[0].contentWindow;
                callback(win);
            }
        }).appendTo('body');
        
        //去除IFRAME
        window.setTimeout("$('#"+id+"').remove();",1000);
    },
    /**
     * 跨域装载页面,获取页面的win窗口对象
     * @param string url
     * @param function callback
     * @param string charset
     */
    'crossGetHtml':function(url,callback,charset){
        if($.isEmptyObject(url) || !$.isFunction(callback)){
            return;
        }
        
        //初始化返回
        if(charset===undefined){
            charset = 'UTF-8';
        }
        
        var id = 'i_'+new Date().getTime();
        
        //装载url数据
        $('<iframe>',{
            'id':id,
            'src':url,
            'style':'display:none',
            'load':function(){
                var win = $(this)[0].contentWindow;
                callback(win);
            }
        }).appendTo('body');
        
        //去除IFRAME
        window.setTimeout("$('#"+id+"').remove();",1000);
        
    }
});

    基本思路就是用iframe装载你需要的页面,然后从页面获取你所需要的任何数据,包括页面或者DOM对象。甚至可以用crossGetScript函数跨域动态加载JS脚本。再在回调函数里面通过操作iframe的window对象,可以获取加载脚本的函数或者变量。

© 著作权归作者所有

leeldy
粉丝 29
博文 21
码字总数 2292
作品 0
长沙
程序员
私信 提问
加载中

评论(2)

leeldy
leeldy 博主

引用来自“云轩阁”的评论

可以干什么用?

动态加载跨域JS脚本。当碰到js跨域问题的时候有用。
最初的-梦想
最初的-梦想
可以干什么用?
为什么浏览器不能跨域

现在很多人特别是前端开发人员,在ajax请求,XMLHttpRequest的过程中会碰到一个问题,那就是跨域请求: 当我们javaScript脚本试图跨域访问时,浏览器会告诉你类似于No 'Access-Control-Allo...

吞吞吐吐的
2017/10/11
0
0
关于跨域与 csrf 的那些小事

前言   在这段时间,部门前辈分享了不少干货。我学到了不少内容,并对其进行简单整理,以便更好地转化为自己的知识。 知识探讨部分 关于跨域 产生 协议,域名,端口三者其中存在不同都会形...

DDong
09/03
0
0
javascript跨域请求解决方法总结

javascript中有同源策略,javascript存在跨域通信的问题。典型例子如:Ajax无法直接请求跨域的普通文件,存在跨域无权限访问的问题。 几种常见的解决方法: 1.JSONP 2. window.name+frame 3...

wait106427
2015/08/18
364
0
关于JavaScript“跨域”问题的总结

什么是同源策略? 同源策略阻止从一个域上加载的脚本获取或操作另一个域上的文档属性。也就是说,受到请求的 URL 的域必须与当前 Web 页面的域相同。这意味着浏览器隔离来自不同源的内容,以...

红薯
2010/04/20
2.9K
5
如何设置iframe高度自适应,在跨域的情况下能做到吗?

  在页面上使用iframe来动态加载页面内容是网页开发中比较常见的方法。在父页面中给定一个不带滚动条的iframe,然后对属性src指定一个可加载的页面,这样当父页面被访问的时候,子页面可以...

恐空控
2013/09/01
365
1

没有更多内容

加载失败,请刷新页面

加载更多

Spring Boot 2 实战:使用 Spring Boot Admin 监控你的应用

1. 前言 生产上对 Web 应用 的监控是十分必要的。我们可以近乎实时来对应用的健康、性能等其他指标进行监控来及时应对一些突发情况。避免一些故障的发生。对于 Spring Boot 应用来说我们可以...

码农小胖哥
今天
6
0
ZetCode 教程翻译计划正式启动 | ApacheCN

原文:ZetCode 协议:CC BY-NC-SA 4.0 欢迎任何人参与和完善:一个人可以走的很快,但是一群人却可以走的更远。 ApacheCN 学习资源 贡献指南 本项目需要校对,欢迎大家提交 Pull Request。 ...

ApacheCN_飞龙
今天
4
0
CSS定位

CSS定位 relative相对定位 absolute绝对定位 fixed和sticky及zIndex relative相对定位 position特性:css position属性用于指定一个元素在文档中的定位方式。top、right、bottom、left属性则...

studywin
今天
7
0
从零基础到拿到网易Java实习offer,我做对了哪些事

作为一个非科班小白,我在读研期间基本是自学Java,从一开始几乎零基础,只有一点点数据结构和Java方面的基础,到最终获得网易游戏的Java实习offer,我大概用了半年左右的时间。本文将会讲到...

Java技术江湖
昨天
7
0
程序性能checklist

程序性能checklist

Moks角木
昨天
7
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部