window.name应用于浏览器端数据存储
本代码简单地分享利用window.name实现浏览器端数据存储：
1、在同一个页面一个地方设置window.name = "abc"，另外一个地方读取window.name，自然能得到"abc"，这个很简单就不举例了
2、利用window.name实现页面跨域交互：demo.html是主页面，proxy.html是一个空的HTML文件（由于OSC不允许不输入任何代码，所以这里加了个空script），这两个文件都在同一个域下；remote.html是另外某个域下的文件
代码中有这么两处设置：
frame.contentWindow.location = self.cfg.proxyUrl;
和
frame.src=url;
这里说明下：
第一处设置是为了设置当前页面地址栏显示的URL（这样浏览器历史记录中也存的是这个），它是一个站内URL
第二处设置是为了让iframe显示的文档来自远程页面
1.图片
2. [代码]demo.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>window.name实现跨域主页面</title>
</head>
<body>
<button id="getDataBt">获取数据</button>
<div id="result"></div>
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script>
$(function() {
dataRequest = {
_doc : document,
cfg: {
proxUrl: 'proxy.html' // proxy.html是一个空文件
}
};
dataRequest.send = function(url, callback) {
if(!url || typeof url !== "string") {
return;
}
var frame = this._doc.createElement("iframe"), state = 0, self = this;
this._doc.body.appendChild(frame);
frame.style.display = "none";
var clear = function() {
try {http://www.huiyi8.com/qzone/
frame.contentWindow.document.write('');
frame.contentWindow.close();
self._doc.body.removeChild(frame);
}QQ空间背景
catch(e) {
}
};
var getData = function() {
try {
var data = frame.contentWindow.name;
}
catch(e) {
}
clear();
if(callback && typeof callback === "function") {
callback(data);
}
};
$(frame).load(function() {
if(state === 1) {
getData();
}
else if(state === 0) {
state = 1;
frame.contentWindow.location = self.cfg.proxyUrl;
}
});
frame.src = url; // 设置frame的src属性为远程页面的URL
};
var testUrl = 'remote.html?' + new Date().getTime();
$("#getDataBt").click(
function() {
dataRequest.send(testUrl, function(result) {
$("#result").html(result);
});
}
);
});
</script>
</body>
</html>
3. [代码]proxy.html
<script type="text/javascript">
//
</script>
4. [代码]remote.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>远程页面</title>
</head>
<body>
<div id="content">
我是远程数据，来自remote.html！
</div>
</body>
<script type="text/javascript">
window.name = document.getElementById("content").innerHTML;
</script>
</html>
