HTML DOM localStorage प्रॉपर्टीज
HTML DOM localStorage प्रॉपर्टीज उपयोगकर्ता को भविष्य के संदर्भ के लिए लोकल ब्राउज़र में ही की-वैल्यू पेयर्स स्टोर करने में सक्षम बनाती हैं। की-वैल्यू पेयर्स तब तक नहीं खोते जब तक उन्हें स्पष्ट रूप से हटाया/क्लियर न किया जाए।
सिंटैक्स
Window.localStorage
यहां, localStorage में निम्न प्रॉपर्टीज/मेथड्स हो सकते हैं:
- setItem('key','value')
- getItem('key')
- removeItem('key')
उदाहरण
आइए localStorage प्रॉपर्टीज का एक उदाहरण देखें:
<!DOCTYPE html> <html> <head> <title>LocalStorage clear()</title> <style> form { width:70%; margin: 0 auto; text-align: center; } * { padding: 2px; margin:5px; } input[type="button"] { border-radius: 10px; } table,th,td { border:1px solid black; border-collapse: collapse; margin: 0 auto; } </style> </head> <body> <form> <fieldset> <legend>LocalStorage clear( )</legend> <table> <tr> <th>Key</th> <th>Value</th> </tr> <tr> <td>PassKey</td> <td>ja12ertplo</td> </tr> </table> <input type="button" value="Store Key" onclick="storeData()"> <input type="button" value="Delete Key" onclick="clearData()"> <div id="divDisplay"></div> </fieldset> </form> <script> var divDisplay = document.getElementById("divDisplay"); var extStyle = document.getElementById("extStyle"); function clearData(){ localStorage.clear(); divDisplay.textContent = 'Succesfully Deleted'; } function storeData(){ localStorage.setItem('PassKey','ja12ertplo'); divDisplay.textContent = 'Succesfully Stored'; } </script> </body> </html>
आउटपुट
'Store Key' बटन पर क्लिक करने के बाद:
'Delete Key' बटन पर क्लिक करने के बाद:
