站内AJAX跨域可以通过document.domain和iframe实现，比如www.css88.com、js.css88.com、css88.com这3个域名其实是3个不同的域，很多时候www.css88.com和css88.com打开的可能是用一个页面，但是，他们确实是不同的域，比如www.css88.com的页面通过ajax无法直接获取css88.com域下的数据，这是由于js的安全性引起的。

不过我们可以通过document.domain和iframe实现在站内的ajax跨域。

查看demo：http://www.css88.com/demo/iframe-domain/

还有一点要注意，这个方法需要在iframe加载后才能使用！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>使用document.domain和iframe实现站内AJAX跨域</title>

<script type="text/javascript" src="http://www.css88.com/tool/css3Preview/jquery-1.4.2.min.js"></script>

</script>

</head>

<body>

	<div id="test"></div>

    <!--<iframe src="http://css88.com/demo/domain/iframe.html" id="iframe" style="display:none;"></iframe>-->

<script type="text/javascript">

//document.write(document.domain)

document.domain = "css88.com";

var createAjaxIframe={

	appIframe: function(iframeId, iframeSrc){

		var iframe = document.createElement("iframe");

		iframe.src = iframeSrc// "http://css88.com/demo/domain/iframe.html";

		iframe.id = iframeId;

		iframe.style.display = "none";

		if (iframe.attachEvent) {

			iframe.attachEvent("onload", function(){

				createAjaxIframe.domainAjax(iframeId);

			});

		}else {

			iframe.onload = function(){

				createAjaxIframe.domainAjax(iframeId);

			};

		}

		document.body.appendChild(iframe);

	},

	domainAjax: function(iframeId){

		var iframeDom = document.getElementById(iframeId).contentWindow.$;

		iframeDom.getJSON("http://css88.com/demo/iframe-domain/city.html", function(date){

			var cityOption = "";

			for (i = 0; i < date.length; i++) {

				cityOption += date[i].c_name + "--" + date[i].c_value + "<br />"

			}

			$("#test").html(cityOption);

		});

	}

};

createAjaxIframe.appIframe("iframe","http://css88.com/demo/iframe-domain/iframe.html");

</script>

<!--统计-->

<script type="text/javascript">

var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");

document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));

</script>

<script type="text/javascript">

try {

var pageTracker = _gat._getTracker("UA-3448069-1");

pageTracker._trackPageview();

} catch(err) {}</script>

</body>

</html>

　　

使用document.domain和iframe实现站内AJAX跨域的更多相关文章

  1. 用iframe设置代理解决ajax跨域请求问题

    面对ajax跨域请求的问题,想用代理的方式来解决这个跨域问题.在服务器端创建一个静态的代理页面,在客户端用iframe调用这个代理 今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到aja ...

  2. JS跨域（ajax跨域、iframe跨域）解决方法及原理详解（jsonp）

    这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...

  3. 如何设置iframe高度自适应，在跨域的情况下能做到吗？

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

  4. 【转】JS跨域（ajax跨域、iframe跨域）解决方法及原理详解（jsonp）

    这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...

  5. 关于ajax跨域请求（cross Domain）

    Cross Domain AJAX主要就是A.com网站的页面发出一个XMLHttpRequest,这个Request的url是B.com,这样的请求是被禁止的,浏览器处于安全考虑不允许进行跨域访问, ...

  6. iframe可通过postMessage解决跨域、跨窗口消息传递

    https://www.cnblogs.com/dorothyorsusie/p/6178599.html //iframe传参给父级页面 function give_info(){ console. ...

  7. 黄聪：利用iframe实现ajax 跨域通信的解决方案（转）

    原文:http://www.cnblogs.com/xueming/archive/2013/02/01/crossdomainajax.html 在漫长的前端开发旅途上,无可避免的会接触到ajax, ...

  8. CSS完美实现iframe高度自适应（支持跨域）

    Iframe的强大功能偶就不多说了,它不但被开发人员经常运用,而且黑客们也常常使用它,总之用过的人知道它的强大之处,但是Iframe有个致命的"BUG"就是iframe的高度无法自 ...

  9. iframe中涉及父子页面跨域问题

    什么是跨域? 跨域,指的是浏览器不能执行其他网站的脚本.它是由浏览器的同源策略造成的,是浏览器施加的安全限制.所谓同源是指相同的域名.协议和端口,只要其中一项不同就为跨域. 举几个例子: http:/ ...

随机推荐

  1. Python __setitem__()、__getitem__()、__delitem__()

    转载:http://blog.csdn.net/xhw88398569/article/details/48690163 __xxxitem__:使用 [''] 的方式操作属性时被调用 __setit ...

  2. Spring学习笔记2—AOP

    1.AOP概念 AOP(Aspect Oriented Programming):面向切面编程,AOP能够将那些与业务无关,却为业务模块所共同调用的应用(例如事务处理.日志管理.权限控制等)封装起来, ...

  3. pip升级或卸载安装的包的方法

    先 pip list 看看包的具体名字是什么,然后 pip uninstall **包名** ===== 打印出有新版本的包: pip list --outdated --format=freeze ...

  4. 我的第二个Python小程序

    输出0-100之间的偶数: # Author: fansik # Description: Output an even number between 0 and 100 # method one n ...

  5. CSS中input输入框点击时去掉外边框方法【outline:medium;】----CSS学习

    CSS 中添加 outline:medium; JS 控制焦点: $("#CUSTOM_PHONE").focus(function(event){ // this.attr(&q ...

  6. 03_Hadoop简单介绍以及版本信息

    一.海量数据: 量:大.数目多,数据量到达PB.ZB级别,条目数到达几十亿条.百亿条 1)存储:分布式,集群的概念,管理(主节点.从节点),HDFS(HadoopDistributedFileSyst ...

  7. busybox rmmod error — rmmod: chdir(2.6.25): No such file or directory

    busybox rmmod error rmmod: chdir(2.6.25): No such file or directory 1. install your modules in dir / ...

  8. Linux 安装扩展yum源

    Linux 安装扩展yum源 下载rpm扩展:http://rpmfind.net/linux/epel/6/x86_64/epel-release-6-8.noarch.rpm CentOS/RHE ...

  9. 八、linux优化一

    1.关闭selinux sed –I ‘s#SELINUX=enforcing#SELINUX=disabled#g’ /etc/selinux/config grep SELINUX=disable ...

  10. OC中NSSet去重细节

    我们都知道,NSSet在存储数据时,不允许存储相同数据?那么,这里的相同该如何理解呢? 很多人都简单的理解为按照其存储对象的内存地址进行评判.其实不然.经过个人实验证明:当类型为NSString,NS ...