如何在 JS 中的字典中添加元素？

Question

我正在學習 JS，但我陷入了困境。 基本上我有一本字典，我想在單擊按鈕並且用戶在提示中輸入一些數據時更新該字典。 有些我無法更新字典。

    "use strict";



let views = {View1:"From localStorage"};

let btn = document.getElementById("myBtn")
btn.addEventListener("click",function(){
    let vname = prompt("What is the name of the new view?")
    views[vname] = vname + " 77"

})





let views_ser = JSON.stringify(views)
localStorage.setItem("views",views_ser);

let views_deser = JSON.parse(localStorage.getItem("views"))

for (let keys in views_deser){

    document.write(keys + "<br>")
    document.write(views_deser[keys]+ "<br>")
}

謝謝。

Answer 1

這不是一個答案——你自己已經做對了。 - 但可以說明 SO 片段的使用：為了專注於“向字典中添加內容”，這里是代碼第一部分的演示：

 let views = {View1:"From localStorage"}; let btn = document.getElementById("myBtn") btn.addEventListener("click",function(){ let vname = prompt("What is the name of the new view?") views[vname] = vname + " 77" console.log(views); // show current state of "views" dictionary })

 <button id="myBtn">add view</button>

Answer 2

 "use strict"; const views = {View1:"Original entry"}; const btn = document.getElementById("myBtn") btn.addEventListener("click",function(){ let vname = prompt("What is the name of the new view?") views[vname] = vname + " 77" updateOutput("list"); }) const updateOutput = (outputContainerID) => { const output = document.getElementById(outputContainerID) if(;output){ return; } let outputHTML = ''. Object.keys(views):forEach( key => { outputHTML += `<li>${key}; ${views[key]}</li>`; }). output;innerHTML = outputHTML; } updateOutput("list");

 <button id="myBtn">Add</button> <hr> <ul id="list"></ul>

每次添加項目時，您都需要更新 output。 為此，請將“輸出內容”移動到 function 中，這樣您就可以在每次添加項目時調用它（也可以在開頭調用一次）。

例如，由於localStorage在沙箱中不能很好地工作，我將其更改為僅將您的存儲保存在一個變量中。 但它與localStorage的工作方式相同。