HTML5 localStorage的雙引號中添加

Question

我目前分配字段的值給一個變量：

userName = document.getElementById('userName').value; 

然後分配該變量的localStorage：

localStorage.setItem('userName', JSON.stringify(userName)); 

這裏獲取該項目：

var retrievedUserName = localStorage.getItem('userName'); 

然後嘗試輸出項目的內容到一個HTML div：

document.getElementById("response-heading-name2").innerHTML = retrievedUserName; 

...但是當我檢查的HTML，它的輸出與它周圍的雙引號括起來的：「我的名字」

有誰知道爲什麼發生這種情況，我怎麼能阻止雙引號從出現？

Answer 1

這與本地存儲無關。

當您將數據結構轉換爲JSON並使用JSON.stringify時，會添加引號。

在從本地存儲中檢索到JSON後，您應該將JSON轉換回帶有JSON.parse的JavaScript數據結構。

---

使用JSON的一點是要確保你存儲的是一個字符串，因爲本地存儲只能存儲字符串。

由於您正在獲取輸入的值，因此您知道它將是一個字符串。所以你可以完全放棄JSON而不是JSON.stringify它首先。

Answer 2

localStorage總是用雙引號存儲字符串數據，當您檢索相同的數據時，您將使用雙引號。所以只需使用JSON.parse來修復它。

var retrievedUserName = JSON.parse(localStorage.getItem('userName'));