在javascript中使用var作为var名称

我有个小问题。 我要做的是创建一个InnerHTML变量

<div id="MyDiv"></div>

也许代码可以更好地解释它，我现在拥有：

<div id="MyDiv"></div>

---Javascript---

var VarOne = 'Four';        
var VarTwo = 'Five';
var VarThree = 'Six';


function MyFunction(){
document.getElementById("MyDiv").innerHTML = ['Var' + event.target.id];
     }

<div id="MyDiv"></div>

---Html---

<div id="MyDiv"></div>

---

它没有寻找var，而是在逻辑上给出“VarOne、VarTwo或VarThree”作为结果，但我如何使其使用var？

默认范围内的变量在窗口对象中。您应该能够做到：

<div id="MyDiv"></div>

var id = 'One'
var VarOne = 'Four';
var VarTwo = 'Five';
var VarThree = 'Six';

alert(window["Var" + id]); // => Four

因此，您应该能够将MyFunction的内容更改为：

<div id="MyDiv"></div>

document.getElementById("MyDiv").innerHTML = window['Var' + event.target.id];

---

现在，我不是JavaScript专家，但也许eval会做你想做的事

<div id="MyDiv"></div>

 var results = eval('Var' + number);

---

或者，您也可以创建一个数组，并通过这种方式访问数据。

更安全、结构更好的版本可能包括以下内容：

<div id="MyDiv"></div>

var DivContents = {
    VarOne : "Four",
    VarTwo : "Five",
    VarThree : "Six"
};


function MyFunction(){
    document.getElementById("MyDiv").innerHTML = DivContents['Var' + event.target.id];
}

---

不要直接使用字符串作为变量名，而是将值放入哈希：

<div id="MyDiv"></div>

var Vars = { 'One': 'Four', 'Two': 'Five', 'Three': 'Six' };        


function MyFunction(){
  document.getElementById("MyDiv").innerHTML = Vars[event.target.id];
}

---

虽然Jonathan的答案是正确的，但是应该避免使用变量污染window对象

<div id="MyDiv"></div>

考虑重构以使用对象存储这些值：

<div id="MyDiv"></div>

var values = {one:'four', two:'five', three:'six'};

function MyFunction(){
    document.getElementById("MyDiv").innerHTML = values[event.target.id];
}

---

这在窗口范围中只剩下一个变量，也可以通过使用闭包来避免。

+1，主要是因为他建议eval并不意味着默认情况下他应该被否决。这是一个非常合理的解决方案，特别是当变量不在全局范围内时。这不是有点取决于数字的来源吗？如果它是由用户定义的，那似乎是一个缺陷。@Lusitanian:我不知道这是一个合理的解决方案。在几乎所有情况下，安排数据以便在无需评估的情况下访问数据应该是可能的，并且不需要做太多工作。除非你有一个类似于回复的东西，否则就不需要评估。这里实际上有一个问题：什么时候评估不是邪恶的：@Thilo我同意这不是最优的，但有可能提问者过于简化了问题，出于某种原因，他是；强制以这种方式访问数据。不管怎样，我还是让他决定使用对象+1，因为我完全忘记event.target是一个HTML元素，它的id通常不是整数。

<div id="MyDiv"></div>