Javascript 是否可以将变量用作dom元素？

我在表单中有几个输入字段，每个字段都有一个唯一的名称。例如，要更改颜色，我将执行以下操作：

testForm.username.style.background = "yellow";

username

为输入名称，

testform

为表单名称

我想这样做：用变量

elem

替换

username

，这样当我调用函数更改背景颜色时，我就不需要为每个唯一的字段使用单独的函数。我只需发送

元素

名称，该函数将适用于每个字段

testForm.elem.style.background = "yellow";

---

我的问题是它不起作用。例如，它将

elem

传递给函数fine，但它表示

testForm.elem.style

为

null

。出于某种原因，我猜javascript不喜欢元素名的变量？

您必须执行eval才能执行类似操作，例如eval（“testform.+elem+”.style.background=yellow”）

试试看

或

---

在第一种情况下，

elem

保存用户名，在第二种情况下，

elem

指向实际的DOM元素。

可以使用

object.property

或

object[“property”]

语法访问JavaScript对象的属性（在这种情况下，对象“testform”的“username”属性）。由于第二种形式采用字符串（如双引号所示），因此包含字符串的变量也可以与该语法一起使用。因此：

testform[elem].style.background = "yellow";

---

将执行您想要的操作。

听起来您正在创建一个函数来执行此操作。在这种情况下，为什么不使用以下功能：

function changeBackgroundOfElementToYellow(element){
  element.style.background = "yellow";
}

并称之为：

changeBackgroundofElementToYellow(testForm.username);

---

总的来说，我发现发布的raylel/kangax方法已经更好了，但这是另一种选择。

不要使用

eval（）

，它只会让你头疼。看看这不是个好主意。从

elements

集合中访问它会更可靠，更符合标准，例如：

testForm.elements[elem].style.backgroundColor='yellow'

RaYell谢谢你的帮助，它工作起来就像我希望的那样。我的印象是testForm[elem].style和testForm.elem.style是一样的。。。我想不会吧！使用elements集合的优点是什么？除了符合标准之外，它对我有什么帮助？在尝试修改元素之前，我还会测试元素（及其

样式
属性）是否存在-
var el=testForm.elements[elem]；如果（el&&el.style）el.style.backgroundColor='黄色'
testform[elem].style.background = "yellow";
function changeBackgroundOfElementToYellow(element){
  element.style.background = "yellow";
}

changeBackgroundofElementToYellow(testForm.username);