javascript - 更新 for 循环中的值/重置 for 循环？

Question

我正在开展我的第一个学校项目，因此我在制作此类 Web 应用程序方面没有太多经验，这就是我决定在这里提问的原因。

如何更新 for 循环语法中的值或完全重置它，以便它再次迭代，就像我刚刚重新加载它一样？我决定不展示另一个功能，只是因为它没有用。它最终所做的是将taskCount.length增加1。这部分在技术上是可行的，但问题是，我现在要向您展示的函数，一旦迭代，将始终保留默认的 taskCount.length 值，一旦页面加载，它就永远不会改变。有什么办法可以更新吗？

这是一个示例:上面的函数使 taskCount.length = '5' 但当页面启动时它是 taskCount.length = 4，当我执行 alert(taskCount.length) 从控制台，我得到 5。但是 for 循环不想改变。

for (var i = 0; i < taskCount.length; i++) {    
            document.getElementsByClassName('task')[i].addEventListener('click', ((j) => {         
                return function() {
                    var shadow = document.createElement('div');
                    // Styling
                    var changingWindow = document.createElement('div');
                    // Styling
                    var changingTitle = document.createElement('p');
                    // Styling
                    var changingText = document.createElement('p');
                    // Styling
                    var changingTitleNode = document.createTextNode('Промяна');
                    var changingTextNode = document.createTextNode('Моля, изберете действие.');
                    var deleteTask = document.createElement('button');
                    var goUp = document.createElement('button');
                    var goDown = document.createElement('button');
                    var unchange = document.createElement('button');
                    // Styling
                    var deleteElementNode = document.createTextNode('Премахни задачата');
                    var goUpNode = document.createTextNode('Премести нагоре');
                    var goDownNode = document.createTextNode('Премести надолу');
                    var unchangeNode = document.createTextNode('Отказ');
                    var justBreak = document.createElement('br');
                    var justBreakAgain = document.createElement('br');
                    var justBreakOneMoreTime = document.createElement('br');
                    body.appendChild(shadow);
                    shadow.appendChild(changingWindow);
                    changingWindow.appendChild(changingTitle);
                    changingTitle.appendChild(changingTitleNode);
                    changingWindow.appendChild(changingText);
                    changingText.appendChild(changingTextNode);
                    changingWindow.appendChild(deleteTask);
                    deleteTask.appendChild(deleteElementNode);
                    deleteTask.onclick = function() {
                        document.getElementsByClassName('task')[j].parentNode.removeChild(document.getElementsByClassName('task')[j]);
                        shadow.parentNode.removeChild(shadow);
                        localStorage.setItem("listContent", document.getElementById('list').innerHTML);
                    }
                    changingWindow.appendChild(justBreak);
                    changingWindow.appendChild(goUp);
                    goUp.appendChild(goUpNode);
                    goUp.onclick = function() {
                        if (j !== 0) {
                            var saveThisTaskValue = document.getElementsByClassName('task')[j].innerHTML;
                            var savePreviousTaskValue = document.getElementsByClassName('task')[j - 1].innerHTML;
                            document.getElementsByClassName('task')[j].innerHTML = savePreviousTaskValue;
                            document.getElementsByClassName('task')[j - 1].innerHTML = saveThisTaskValue;
                        }
                        shadow.parentNode.removeChild(shadow);
                        localStorage.setItem("listContent", document.getElementById('list').innerHTML);
                    }
                    changingWindow.appendChild(justBreakAgain);
                    changingWindow.appendChild(goDown);
                    goDown.appendChild(goDownNode);
                    goDown.onclick = function() {
                        if (j !== document.getElementsByClassName('task').length - 1) {
                            var saveThisTaskValue = document.getElementsByClassName('task')[j].innerHTML;
                            var saveNextTaskValue = document.getElementsByClassName('task')[j + 1].innerHTML;
                            document.getElementsByClassName('task')[j].innerHTML = saveNextTaskValue;
                            document.getElementsByClassName('task')[j + 1].innerHTML = saveThisTaskValue;
                        }
                        shadow.parentNode.removeChild(shadow);
                        localStorage.setItem("listContent", document.getElementById('list').innerHTML);
                    }
                    changingWindow.appendChild(justBreakOneMoreTime);
                    changingWindow.appendChild(unchange);
                    unchange.appendChild(unchangeNode);
                    unchange.onclick = function() {
                        shadow.parentNode.removeChild(shadow);
                    }
                }
            })(i))
        }

Answer 1

由于页面重新加载，您始终可以将该值保存为 cookie 并一次又一次地重复使用。您可以随时更新。