1) Utiliser le stockage local (localStorage) :
Accédez à la fonction de stockage local via l'attribut global localStorage, et renverra un stockage Objet, qui est utilisé pour contenir des paires chaîne sous forme de clé/valeur.
Membres de l'objet Storage :
clear() - supprime la paire clé/valeur enregistrée ; >
getItem(<key>)——Obtenir la valeur associée à la clé spécifiée
key(< ;index>)——Obtenir la clé de la longueur index
spécifiée——Renvoyer le nombre de paires clé/valeur enregistrées
removeItem(
setItem(< ;key> ,
tableau pour obtenir la valeur associée à la clé spécifiée
Écoutez l'événement de stockage Lorsqu'un document modifie le stockage local, l'événement de stockage sera déclenché, et l'objet attribué est un objet StorageEvent, dont les membres sont :clé - le retour se produit Clé modifiée
oldValue - renvoie l'ancienne valeur associée à cette clé
newValue - renvoie la nouvelle ; valeur associée à cette clé ;
url - Renvoie l'URL du document modifié
storageArea - Renvoie l'objet Storage modifié ; 🎜>
2) Utiliser le stockage de session (
session<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>上海远地资产管理有限公司</title> <meta name="author" content="jason"/> <meta name="description" content="上海远地资产管理有限公司(简称:远地资产),是一家专业的互联网金融服务平台."/> <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"/> <style type="text/css"> body > *{ float:left; } table{ border-collapse: collapse; margin-left: 50px; } th,td{ padding: 4px; } th{ text-align: right; } input{ border:thin solid black; padding: 2px; } label{ min-width: 50px; display: inline-block; text-align: right; } #countmsg,#buttons{ margin-left: 50px; margin-top:5px; margin-bottom: 5px; } </style> </head> <body> <p> <p> <label>Key:</label> <input id="key" placeholder="Enter Key"> </p> <p> <label>Value:</label> <input id="value" placeholder="Enter Value"> </p> <p id="buttons"> <button id="add">Add</button> <button id="clear">Clear</button> </p> <p id="countmsg">There are <span id="count"></span> items</p> </p> <table id="data" border="1"> <tr> <th>Item Count:</th><td>-</td> </tr> </table> <script> displayData(); var buttons=document.getElementsByTagName("button"); for(var i=0;i<buttons.length;i++){ buttons[i].onclick=handleButtonPress; } function handleButtonPress(e){ switch(e.target.id){ case 'add': var key=document.getElementById("key").value; var value=document.getElementById("value").value; localStorage.setItem(key,value); break; case 'clear': localStorage.clear(); break; } displayData(); } function displayData(){ var tableElem=document.getElementById("data"); tableElem.innerHTML=""; var itemCount=localStorage.length; document.getElementById("count").innerHTML=itemCount; for(var i=0;i<itemCount;i++){ var key=localStorage.key(i); var val=localStorage[key]; tableElem.innerHTML+="<tr><th>"+key+":</th><td>"+val+"</td></tr>"; } } </script> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> table{ border-collapse: collapse; margin-left: 50px; } th,td{ padding: 4px; } </style> </head> <body> <table id="data" border="1"> <tr> <th>key</th> <th>oldValue</th> <th>newValue</th> <th>url</th> <th>storageArea</th> </tr> </table> <script> var tableElem=document.getElementById("data"); window.onstorage=handleStorage; function handleStorage(e){ var row="<tr>"; row+="<td>"+ e.key+"</td>"; row+="<td>"+ e.oldValue+"</td>"; row+="<td>"+ e.newValue+"</td>"; row+="<td>"+ e.url+"</td>"; row+="<td>"+ (e.storageArea == localStorage)+"</td></tr>"; tableElem.innerHTML+=row; } </script> </body> </html>
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!