sessionStorage

Scope: limited to document origin level; It is also limited to Windows, meaning that homogenous documents cannot share data in different browser tabs (* If a browser contains two elements that contain documents that are homogenous, the two can share data).

Validity period: When the page TAB is closed, all data stored through seesionStorage will be deleted.

localStorage

Scope: Restricted to the document origin level and restricted by the browser vendor, which cannot read or write data across browsers.

Validity period: Stored data is permanent and will never expire on the user’s computer unless the Web application can delete the stored data.

cookie

Cookie data automatically follows HTTP requests between web browsers and Web servers.

Scope: The default is document Origin. And default is associated with the page of it was created, and the web page and gaiweb page directory or subdirectory with other web pages can be seen, such as http://www.a.com/b/index.html to create a cookie, So the cookie is visible to the page http://www.a.com/b/other.html and http://www.a.com/b/c/index.html, but not visible on http://www.a.com/a/index.html. It can be changed by setting the domain property of the cookie (the domain of the cookie can only be set to the domain of the current server) and the path property.

Expiration date: By default, the cookie is saved until the browser closes (* non-tab page closes). The max-age attribute can be used to explicitly tell the browser the expiration date of the cookie.

Save the cookies:

function setcookie(name, vlaue, liveTime){
    var cookie = name+'='+encodeURIComponent(value);
    if(typeof liveTime === 'number'){
        cookie += "; max-age="+liveTime;
    }
    document.cookie = cookie;
}
Copy the code

If you want to set the path and domain attributes of the cookie, you simply append them to the cookie value in the same manner as the max-age attribute. To delete a cookie, set the cookie value to null and set max-age to 0.