如何获取函数名称和 getElementById 中的变量答案

【问题标题】：How to get variables in function name and getElementById如何获取函数名称和 getElementById 中的变量
【发布时间】：2023-03-27 07:49:01
【问题描述】：

嗨，我有一个 while 循环：

var i = 0;

while(i < 20)
{
    function showi()
    {
        document.getElementById('tablei').style.display = 'block';
        document.getElementById('hidei').style.display = 'block';
        document.getElementById('showi').style.display = 'none';
    }

    function hidei()
    {
        document.getElementById('tablei').style.display = 'none';
        document.getElementById('hidei').style.display = 'none';
        document.getElementById('showi').style.display = 'block';
    }

 i++;

}

我想知道如何让 i 变量显示在函数名称和 getElementById 中。

【问题讨论】：

当一个函数可以做所有事情时，为什么要创建 20 个函数来做同样的事情？

标签： javascript function while-loop do-while

【解决方案1】：

    function show(i)
    {
        document.getElementById('table' + i).style.display = 'block';
        document.getElementById('hide' + i).style.display = 'block';
        document.getElementById('show' + i).style.display = 'none';
    }

    function hide(i)
    {
        document.getElementById('table' + i).style.display = 'none';
        document.getElementById('hide' + i).style.display = 'none';
        document.getElementById('show' + i).style.display = 'block';
    }

最好制作一个函数，例如“show(1)”或“show(42)”调用

【讨论】：

非常感谢您绞尽脑汁 2 天的工作完美 XD

【解决方案2】：

您想使用字符串连接运算符“+”。

也就是说，你可以这样写：

'table' + i

如果你遍历不同的 i 值，你会得到你想要的变量名：

table0
table1
table2
table3
...

【讨论】：

【解决方案3】：

我猜你想创建

show1(), show2(), show3(), etc...

用这个循环？就目前而言，您只是一遍又一遍地重新定义相同的函数。

您不能创建动态函数名称，例如

function show + i() { ... }

不可能。您可以使用 eval 调用来伪造它：

eval('function show' + i + '() { ... }');

但是 eval() 是完全邪恶的，不应该使用。

我建议使用数组进行以下解决方法：

show = [];
while(i < 20) {
   show[i] = function() { ... }
}

show[7](); // execute the #7 function

但是，这仍然很丑陋。为什么不简单地将i 作为参数传递？

function show(i) {
   document.getElementById('table' + i).style.display = 'block';
}

将完全按照您的意愿行事，并且仍然只有一个功能，而不是您要定义的 20 多个功能。

【讨论】：