Heim  >  Artikel  >  Web-Frontend  >  js-Code zur Implementierung der Datenübertragung zwischen Seiten

js-Code zur Implementierung der Datenübertragung zwischen Seiten

不言
不言Original
2018-08-13 15:41:302664Durchsuche

Der Inhalt dieses Artikels befasst sich mit dem js-Implementierungscode für die Datenübertragung auf der Seite. Ich hoffe, dass er für Freunde hilfreich ist.

Da mir diese Frage in früheren Interviews gestellt wurde, habe ich sie heute geklärt. Aufgrund meines begrenzten technischen Niveaus können Sie bei Fehlern gerne Kritik äußern.

Dieser Blog fasst zwei Möglichkeiten zusammen, Parameter von einer Seitenebene an eine andere zu übergeben.

1. Über die Cookie-Methode

1. Übergeben Sie den HTML-Code der Cookie-Seite, hier mit dem Namen a.html

请输入用户名和密码:
<input id="userName" type="text" />
<input id="passwords" type="password" />
<button id="btn">设置</button>
<button onclick="login()">传递cookie</button>
<button onclick="deletecookie()">删除</button>

2.a.html js-Code

//设置cookie
var setCookie = function (name, value, day) {
    //当设置的时间等于0时,不设置expires属性,cookie在浏览器关闭后删除
    var expires = day * 24 * 60 * 60 * 1000;
    var exp = new Date();
    exp.setTime(exp.getTime() + expires);
    document.cookie = name + "=" + value + ";expires=" + exp.toUTCString();
};
//删除cookie
var delCookie = function (name) {
    setCookie(name, &#39; &#39;, -1);
};
//传递cookie
function login() {
    var name = document.getElementById("userName");
    var pass = document.getElementById("passwords");
    setCookie(&#39;userName&#39;,name.value,7)
    setCookie(&#39;password&#39;,pass.value,7);
    location.href = &#39;b.html&#39;
}
function deletecookie() {
    delCookie(&#39;userName&#39;,&#39; &#39;,-1)
}

3. Die Seite, die Cookies akzeptiert, ist hier als b.html

<button onclick="getcookie()">获取</button>

4. Der js-Code von b.html

//获取cookie代码
var getCookie = function (name) {
    var arr;
    var reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
    if (arr = document.cookie.match(reg)){
        return arr[2];
    }
    else
        return null;
};
//点击获取按钮之后调用的函数
function getcookie() {
    console.log(getCookie("userName"));
    console.log(getCookie("password"))
}

2 🎜 >

In diesem Fall werden auch Parameter von der Seite a.html an die Seite b.html übergeben

1 Der Code von a.html

<input type="text" value="猜猜我是谁">
<button onclick="jump()">跳转</button>

2 des Eingabe-Tags Der Wert wird an b.html

function jump() {
    var s = document.getElementsByTagName(&#39;input&#39;)[0];
    location.href=&#39;7.获取参数.html?&#39;+&#39;txt=&#39; + encodeURI(s.value);
}

3 übergeben. Code in b.html

<p id="box"></p>
rreee

3. Die Übergabe von Parametern über localStorage

ähnelt Cookies. Aber seien Sie vorsichtig: Um auf ein localStorage-Objekt zugreifen zu können, muss die Seite von demselben Domänennamen stammen (Subdomänennamen sind ungültig), dasselbe Protokoll verwenden und sich auf demselben Port befinden.

1. js-Datei in a.html

var loc = location.href;
var n1 = loc.length;
var n2 = loc.indexOf(&#39;=&#39;);
var txt = decodeURI(loc.substr(n2+1,n1-n2));
var box = document.getElementById(&#39;box&#39;);
box.innerHTML = txt;

2. Datei in .b.html

//将localStorage传递到哪个页面
location.href = &#39;b.html&#39;
//设置localStorage
window.localStorage.setItem(&#39;user&#39;,&#39;haha&#39;);

Verwandte Empfehlungen:

jQuery Was Sind die Methoden in jQuery? Häufig verwendete Methoden in jQuery (mit Code)

Detaillierte Einführung in die Verwendung von Datenobjekten in js (mit Code)

Das obige ist der detaillierte Inhalt vonjs-Code zur Implementierung der Datenübertragung zwischen Seiten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn