HTML5 provides 2 methods for client-side storage: 1, localstorage --no time-limited data storage 2, sessionstorage --for a session of data storage, session end will be emptied a , scope Scope localstorage under the same protocol, hostname, port, can read/modify to the same Localstorage data sessionstorage under the above conditions also required in the same window, That is, as soon as you close the browser (including Close tab), it will be emptied two, VS cookie:1, storage data More (cookie only 4k,localstorage general 5M) 2, speed, high efficiency, data structure using standard key-value data structure, the key is unique, Repeated with the same key to assign a value, the last value will be overwritten. Iv. Localstorage Method 1, feature (1) only supports string type (2) browser is not readable in privacy mode (3) Localstorage can not be crawled to 2, 3 kinds of write method var storage= Window.localstorage; The first type://write a field storage["a"]=1; the second type://write B field storage.b=1; The third type://write to the C field storage.setitem ("C", 3); 3, remove all clear window.localStorage.clear () Deletion of a key-value pair Window.localStorage.removeItem (' a ') 4, especially note that these operations can only operate on data under the same domain five, sessionstorage Method 1, VS Localstorage the same: the various grammatical characteristics are the same: Localstorage data does not have an expiration time setting, and SessionstorageThe stored data is cleared at the end of the page session six, Localstorage cross-domain issues this I would like to highlight, because the project design, so the study for several days, but finally because the project does not apply, But some knowledge wants to be sorted out here we use HTML5 's PostMessage and cross-domain with IFRAME We simulate a scenario: bring the user information from the http://a.com/index.html page to the http://b.com/ Index.html 1, Process:  IMAGE21), insert an IFRAME in a.com, and point to B.com2), A.com Pass the message in the specified format to PostMessage via B.COM3), B.Com parse the message content passed by a.com, call Localstorage API operation Local Data 4), B.Com use data in Localstorage 2, Small knowledge points I have encountered in the process of some of the little points of knowledge I would like to learn with you. When acquiring an IFRAME, we can use Window.frames to get all the IFrame objects, equivalent to document.getElementsByTagName ( "iframe") 3, code (write JS code here only) http://a.com/index.html
var domain = ' http://b.com/index.html ';//define the target domain var message = {userid:1,username: "Wendy"};//You can also pass some data here, obj, etc.// Send Message and Target uriwindow.frames[0].contentwindow.postmessage (Message,domain); Suppose there is only one iframe on the page
Http://b.com/index.html
//Response Event Window.addeventlistener (' Message ', function (event) {if (event.origin!== ' http://a.com/index.html ') return ; Console.log (' Message Received: ' + event.data,event);//The event.data here is the user information just passed over},false);
4, results I do so, event.data inside can not get any useful information, why? Because my requirement is to jump from http://a.com/index.html to http://b.com/index.html, in the open http://b.com/ Index.html when A.com has been destroyed, there is no such IFRAME exists to send data, so the data is not available, that is, it is necessary to include child pages in the parent page when this scenario is feasible. Front-end small white, above is my personal understanding, if there are errors, forget to criticize, thank you reference: http://annn.me/cross-domain-local-storage/http://www.jianshu.com/p/ E86d92aeae69http://blog.csdn.net/monkindey/article/details/23659387http://www.haorooms.com/post/window_ PostMessage
HTML5 Web Storage--localstorage/sessionstorage
