The content of this article is about the js implementation code for data transmission on the page. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.
Since I have been asked this question in previous interviews, I have sorted it out today. Due to my limited technical level, if there are any mistakes, you are welcome to criticize.
This blog summarizes two ways to pass parameters from one page layer to another.
请输入用户名和密码: <input id="userName" type="text" /> <input id="passwords" type="password" /> <button id="btn">设置</button> <button onclick="login()">传递cookie</button> <button onclick="deletecookie()">删除</button>
//设置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, ' ', -1); }; //传递cookie function login() { var name = document.getElementById("userName"); var pass = document.getElementById("passwords"); setCookie('userName',name.value,7) setCookie('password',pass.value,7); location.href = 'b.html' } function deletecookie() { delCookie('userName',' ',-1) }
<button onclick="getcookie()">获取</button>
//获取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")) }
This case also passes parameters from a.html to b.html page
<input type="text" value="猜猜我是谁"> <button onclick="jump()">跳转</button>
function jump() { var s = document.getElementsByTagName('input')[0]; location.href='7.获取参数.html?'+'txt=' + encodeURI(s.value); }
<p id="box"></p>
var loc = location.href; var n1 = loc.length; var n2 = loc.indexOf('='); var txt = decodeURI(loc.substr(n2+1,n1-n2)); var box = document.getElementById('box'); box.innerHTML = txt;
is similar to cookies. But be careful: to access a localStorage object, the page must come from the same domain name (subdomain names are invalid), use the same protocol, and be on the same port.
//将localStorage传递到哪个页面 location.href = 'b.html' //设置localStorage window.localStorage.setItem('user','haha');
<button onclick="getcookie()">获取</button> function getcookie() { //获取传递过来的localStorage console.log(window.localStorage.getItem('user')) }
Related recommendations:
jQuery What are the methods in jQuery? Commonly used methods in jQuery (with code)
Detailed introduction to the usage of data objects in js (with code)
The above is the detailed content of js code to implement data transfer between pages. For more information, please follow other related articles on the PHP Chinese website!