使用 DOM 对象创建备份数组

Question

我有 元素 a 和不同的 option 。加载页面时，我想将这些选项存储为备份（我使用window.onload来执行此操作）。

现在，用户更改 元素 b，这会删除 元素中的一些 option 一个。在对 元素 b 进行其他更改后，我想恢复元素 a 的 option以及我从启动时的备份。

但无论如何，选项上的更改似乎适用于两个数组。

我使用 new Array 创建了备份数组，并将每个选项推送到新数组中。我希望这可以防止它们在从 DOM 中删除时也从数组中删除。

有任何提示我如何解决这个问题吗？

---

function cacheOptions() {
    backupOptions = newArray(document.getElementById("selectElement").options);
}

function newArray(oldArray) {
    var newArray = new Array(oldArray.length);
    for ( var object in oldArray) {
        newArray.push(object);
    }
    return newArray;
}

并删除 onchange 方法中的 option...

document.getElementById("selectElement").options[i].remove();

Answer 1

1. 切勿使用 for in 循环数组；使用普通的 for 循环
2. 您可以使用 arr = [] 创建一个数组；长度将自动设置
3. 您将旧数组的索引附加到新数组；不是它们的值

无论如何，您可以使用 [].slice.call(arr) 从类似数组的对象获取数组。

因此，您最好摆脱 newArray 函数，并将 cacheOptions 函数更改为：

function cacheOptions() {
    backupOptions = [].slice.call(document.getElementById("selectElement").options);
}