两次使用Javascript代码

Question

首先，我想说，我很抱歉没有使用代码示例。这是我第一次问堆栈溢出，我发现它真的令人困惑。

我的javascript代码工作得很好，但是当我试图复制它并更改变量名时，它似乎不起作用。

JavaScript

function saveEdits() {
    var editElem = document.getElementById("edit");    
    var userVersion = editElem.innerHTML;    
    localStorage.userEdits = userVersion;    
    document.getElementById("update").innerHTML="Edits saved!";

}
function checkEdits() {
    if(localStorage.userEdits!=null)
        document.getElementById("edit").innerHTML=localStorage.userEdits;
}

我试图编辑的方式(我对javascript很陌生，我不知道我在做什么)：JavaScript

<script type="text/javascript">
function saveEditsplus() {
    var editElemplus = document.getElementById("editplus");
    var userVersionplus = editElemplus.innerHTML;
    localStorageplus.userEditsplus = userVersionhtml;
}
function checkEditsplus() {
    if(localStorage.userEditsplus!=null)
    document.getElementById("editplus").innerHTML=localStorageplus.userEditplus;
}
</script>

Answer 1

是的，看起来您不知道代码在做什么…localStorage是一个浏览器api，您不能仅仅重命名它(就像您不能--也没有--更改document或innerHTML一样)。

但是，根本没有理由重命名任何变量。通过使用声明，可以使它们成为每个函数的本地函数，这样它们就不会相互干扰。只需更改对元素的引用：

function saveEditsplus() {
    var editElem = document.getElementById("editplus");
    var userVersion = editElem.innerHTML;
    localStorage.userEditsplus = userVersion; // no …html suffix, either
//               ^^^^^^^^^^^^^ the storage reference is global, though
}
function checkEditsplus() {
    if(localStorage.userEditsplus!=null)
    document.getElementById("editplus").innerHTML=localStorage.userEditplus;
}

但是，与复制代码相比，更好的做法是给出这些函数参数--一个用于元素的id，一个用于应该使用的属性 of localStorage。

Answer 2

您不能修改localStorage (浏览器api)！

function saveEdits() {
    var editElem = document.getElementById("edit");    
    var userVersion = editElem.innerHTML;    
    localStorage.userEdits = userVersion;    
    document.getElementById("update").innerHTML="Edits saved!";

}
function checkEdits() {
    if(localStorage.userEdits!=null)
        document.getElementById("edit").innerHTML = localStorage.userEdits;
}