eval 的安全问题，如何替换它

Question

感谢您过去几年的支持。我从来没有写过帖子，这是我的第一篇。

我在网站上有一个旧的树形菜单，我正在更新它以修复一些安全问题，并且我正在尝试替换 eval() 函数。

我认为这是一个简单的任务，但我被困在这一点上，无法进一步。

我有这些代码行：

    this.parse = function(nodes, tree, id) {
        for (var i = 0; i < nodes.length; i++) {
            if (nodes[i].nodeType != 1) {
                continue;
            }
            if (nodes[i].tagName.toLowerCase() == "li") {
                nodes[i].id = id + "-" + tree.length;
                tree[tree.length] = new Array();
                if (nodes[i].childNodes && this.hasUl(nodes[i].childNodes)) {
                    nodes[i].className = "section";
                    var a;
                    var b;
                    if (a = this.getA(nodes[i].childNodes)) {
                        a.id = nodes[i].id + "-a";
                        eval("document.getElementById('"+a.id+"').onclick = function() {"+"self.click('"+nodes[i].id+"');"+"}");
                    }

                 
                } else {
                    nodes[i].className = "box";
                }
            }
            if (nodes[i].tagName.toLowerCase() == "ul") {
                nodes[i].style.display = "none";
                id = id + "-" + (tree.length - 1);
                nodes[i].id = id + "-section";
                tree = tree[tree.length - 1];
            }
            if (nodes[i].childNodes) {
                this.parse(nodes[i].childNodes, tree, id);
            }
        }
    }

我尝试更换评估线

eval("document.getElementById('"+a.id+"').onclick =
    function(){"+"self.click('"+nodes[i].id+"');"+"}")

这样：

document.getElementById(a.id).onclick = 
    function(){self.click(nodes[i].id)};`

但是，如果我单击树形菜单的其中一个文件夹，我会在控制台中收到此错误

未捕获类型错误：无法读取未定义的属性（读取“id”） 在 document.getElementById.onclick`

奇怪的是，如果我将

nodes[i].id

放入变量中并尝试以下代码：

document.getElementById(a.id).onclick = 
    function(){self.click(b)};

错误消失了，树似乎可以工作，但是如果我单击任何文件夹，它只会打开最后一个文件夹。似乎函数“self.click”没有正确分配给树的每个文件夹。

提前感谢您的支持。

树示例： 在此输入图片描述

Answer 1

你可以试试这个

if (a = this.getA(nodes[i].childNodes)) {
    a.id = nodes[i].id + "-a";
    (function(nodeId, aId) {
        document.getElementById(aId).onclick = function() {
            self.click(nodeId);
        };
    })(nodes[i].id, a.id);
}

这样，循环内创建的每个 onclick 函数都将拥有自己的作用域，并具有正确的 Nodes[i].id 和 a.id 值，确保单击每个文件夹时将使用正确的 NodeId 调用 self.click。