黑貓科技 ?宋笑迎
一:JavaScript靜態(tài)頁(yè)面值傳遞之URL篇
通過(guò)URL進(jìn)行傳值.把要傳遞的信息接在URL上.
例子:
傳出參數(shù)的頁(yè)面post.html
-------------------------------------------------------------------------------
用戶名:
性別:
function Post(){
//單個(gè)值Read.html?username=baobao;
//多個(gè)值Read.html?username=baobao&sex=male;
// location.跳轉(zhuǎn)到指定地址
url = "read.html?username="+escape(document.all.username.value);
url+= "&sex=" + escape(document.all.sex.value);
location.href=url;
}
document.querySelector('#post').onclick = function(){
Post();
};
-------------------------------------------------------------------------------
接收參數(shù)的頁(yè)面read.html
-------------------------------------------------------------------------------
// location.search是客戶端獲取url參數(shù)的方法横腿,是從當(dāng)前url的莽囤?號(hào)開(kāi)始的字符串英遭。如當(dāng)前url是“http://www.baodu.con?a=1&b=2”那么search的值就是“?a=1&b=2”
// escape()與unecape()方法:對(duì)字符串進(jìn)行編碼和解碼采呐,例:escape("宋") ---輸出%5b8bunescape("%5b8b")----輸出宋
var url = location.search;
var Request = new Object();
if(url.indexOf("?")!=-1){
var str = url.substr(1);//去掉?號(hào)
var strs = str.split("&");
for(var i=0;i
Request[strs[i].split("=")[0]]=unescape(strs[ i].split("=")[1]);
console.log([strs[i].split("=")[0]]+":"+unescape(strs[ i].split("=")[1]));
}
console.log(Request);
}
優(yōu)點(diǎn):取值方便.可以跨域.
缺點(diǎn):值長(zhǎng)度有限制
二:JavaScript靜態(tài)頁(yè)面值傳遞之Cookie篇
參數(shù)傳出頁(yè)面post2.html
-------------------------------------------------------------------------------
請(qǐng)輸入你的名字:
function setCookie(name,value,expiredays){
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=name+ "=" +escape(value)+((expiredays==null) ? "" : "; expires="+exdate.toGMTString());
location.href="read2.html";
}
document.querySelector('#post').onclick=function(){
var value = document.querySelector('#txt1').value;
console.log(escape(value));
setCookie('name',value,30);
}
-------------------------------------------------------------------------------
接收參數(shù)的頁(yè)面read2.html
-------------------------------------------------------------------------------
function getCookie(name){
if (document.cookie.length>0){
c_start=document.cookie.indexOf(name + "=")
if (c_start!=-1){
c_start=c_start + name.length+1
c_end=document.cookie.indexOf(";",c_start)
if (c_end==-1) c_end=document.cookie.length
return unescape(document.cookie.substring(c_start,c_end))
}
}
return ""
}
console.log((getCookie("name")));
-------------------------------------------------------------------------------
優(yōu)點(diǎn):可以在同源內(nèi)的任意網(wǎng)頁(yè)內(nèi)訪問(wèn).生命期可以設(shè)置.
缺點(diǎn):值長(zhǎng)度有限制.
三:JavaScript靜態(tài)頁(yè)面值傳遞之Window.open篇
這兩窗口之間存在著關(guān)系.父窗口parent.html打開(kāi)子窗口son.html
子窗口可以通過(guò)window.opener指向父窗口.這樣可以訪問(wèn)父窗口的對(duì)象.
read.html
//window.open打開(kāi)的窗口.
//利用opener指向父窗口.
var parentText = window.opener.document.all.maintext.value;
alert(parentText);
優(yōu)點(diǎn):取值方便.只要window.opener指向父窗口,就可以訪問(wèn)所有對(duì)象.不僅可以訪問(wèn)值,還可以訪問(wèn)父窗口的方法.值長(zhǎng)度無(wú)限制.
缺點(diǎn):兩窗口要存在著關(guān)系.就是利用window.open打開(kāi)的窗口.不能跨域.