Front-end cross-page pass value cookie, sessionStorage, url pass parameter

1. Both front-end and back-end cookies can be created and saved on the client side, with a default valid time, and of course, browser cookies can also be cleared;

How to create:

var name="liuliu";
var age=28;
document.cookie="name="+name;
document.cookie="age="+age;

The cookie key-value pair is connected by an equal sign, and the cookies are separated by a semicolon;

Get all cookie strings:

document.cookie;
"name=liuliu;age=28"

Given that the cookie is connected to a string in this form: you can write a method to get the cookie value of a certain key; (chrome browser local test is invalid)

function getCookie(cookie_key) {　　
        var cookies=document.cookie
        if (cookies.length == 0 || cookies_key.length == 0) return;
        var arr = cookies.split(";");
        for (var i = 0; i < arr.length; i++) {
            var somecookie = arr[i].split("=");
            if (somecookie[0] == cookie_key) return somecookie[1];
            break;
        }
  }

The length of the cookie is limited: generally about 4k, usually storing a small amount of information; the cookie is compatible with lower versions of IE;

 

sessionStorage is a new standard of H5, it is a kind of webStorage, like a storage object; supports IE9+; saved on the client side;

Usage Setting: window.sessionstorage.setItem("name","kangkang"); Value: window.sessionstorage[''name"]; 

The validity period is invalid after the current session ends. The simple understanding is to close the current browsing page; the storage size is about 5M; there is a slight difference between different browsers;

 

url pass parameter: its usage scenarios can also boast pages; it also plays a role in passing values;

var url="https://www.baidu.com?page=2";

When you enter another page, you can perform corresponding operations according to the different parameters passed in; you can also write a method to get the parameter value of the url;

Note that although the domain name of the browser address bar controlled by the background remains unchanged, it does not affect the use of this;