JS中利用localStorage防止頁面動態(tài)添加數據刷新后數據丟失

更新時間：2017年03月10日 11:44:39 作者：東都花神

本文給大家分享一段js代碼利用利用localStorage防止頁面動態(tài)添加數據刷新后數據丟失問題，代碼簡單易懂，非常不錯，具有參考借鑒價值，需要的朋友參考下

非常不多說了，直接給大家貼代碼了，具體代碼如下所示：

<!doctype html>
<html lang="en">
<head>
 <meta charset="UTF-8" />
 <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
 <title>Document</title>
 <script src="https://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
 <ul>
  <li>555</li>
  <li>555</li>
  <li>555</li>
  <li>555</li>
 </ul>
 <button>button</button>
 <script type="text/javascript">
  var arrary_li = document.querySelectorAll("li");
  var num;
  $('button').on('click', function () {
    $('li').last().addClass('active')
    for (var i = 0; i < arrary_li.length; i++) {
     if (arrary_li[i].className === 'active') {
      num = i;
     }
    }
    localStorage.setItem('num', num)
    location.reload()
  })
  var getNum = parseInt(localStorage.getItem('num'));
  $('li').eq(getNum).addClass('active');
 </script>
</body>
</html>

以上所述是小編給大家介紹的JS中利用localStorage防止頁面動態(tài)添加數據刷新后數據丟失，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持！

您可能感興趣的文章:

Javascript 判斷Flash是否加載完成的代碼
網站加入flash廣告代碼，利用DIV層來控制進度的狀態(tài)，如果加載swf文件到100%的時候就顯示出flash，把AD層隱藏掉，請看下面實現方法。
2010-04-04
簡述JS控制臺的使用
本文給大家介紹了js控制臺的使用，非常不錯，具有一定的參考借鑒借鑒價值，需要的朋友參考下吧
2018-07-07
js實現類選擇器和name屬性選擇器的示例步驟
這篇文章主要介紹了js實現類選擇器和name屬性選擇器的示例步驟，幫助大家更好的理解和使用js，感興趣的朋友可以了解下
2021-02-02
事件綁定之小測試 onclick && addEventListener
昨晚回去后，和雷子討論如何才能“檢測”到頁面上某個元素都綁定了哪些事件監(jiān)聽函數，第一感覺就是應該從瀏覽器入手，比如FF，或者Chrome等
2011-07-07
JS訪問SWF的函數用法實例
這篇文章主要介紹了JS訪問SWF的函數用法,實例分析了javascript訪問swf文件的方法及易錯點的處理技巧,需要的朋友可以參考下
2015-07-07
JavaScript中ES6規(guī)范中l(wèi)et和const的用法和區(qū)別
這篇文章主要介紹了JavaScript中ES6規(guī)范中l(wèi)et和const的用法和區(qū)別，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2020-08-08
JavaScript事件詳細講解
本文給大家介紹js事件詳解，涉及到事件流，事件處理，事件對象等方面的知識，非常不錯，具有參考借鑒價值，感興趣的朋友一起學習吧
2016-06-06
js添加綁定事件的方法
這篇文章主要為大家詳細介紹了js添加事件的通用方法，還為大家介紹了js綁定事件的常用方式，感興趣的小伙伴們可以參考一下
2016-05-05
JavaScript刪除數組元素的方法
這篇文章主要介紹了JavaScript刪除數組元素的方法,實例分析了javascript中delete函數的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2015-03-03
window.onbeforeunload方法在IE下無法正常工作的解決辦法
下面的代碼可以做到不管用戶是點擊了關閉，或者是在任務欄關閉、點擊后退、刷新、按F5鍵，都可以檢測到用戶即將離開的消息。
2010-01-01