Javascript 无法设置未定义的-JS的边框

我试图通过javascript验证一些代码。我正在经历的戏剧性事件是我收到了一份

“未捕获的TypeError:无法设置未定义的属性“border”

我是javascript新手，试图全面理解为什么会发生这种情况，以及如何在未来的编码项目中防止这种情况。我的目标是，如果验证失败，它会将文本框边框更改为红色

function validation_Step1(event) {
    var Firstbox = document.getElementsByName("Firstbox");

    if (Firstbox.value == null || Firstbox.value == '') {
        document.getElementsByName("Firstbox")
            .style.border = "2px solid red";
        alert("Error");
        return false;
    } else {
        return true;
    }
}

---

这是因为

document.getElementsByName（“Firstbox”）

返回一个

NodeList

，它可以被看作是一个“类”数组

---

如果要仅操作第一个元素来查找元素，则应执行

document.getElementsByName（“Firstbox”）[0]

：

<input type="text" id="login">

---

在加载整个HTML后也要运行JS脚本，在JS中使用onload事件。

getElementsByName不会返回单个元素，而是一个节点列表-因此您必须单独访问其中的元素，例如使用索引符号。返回节点列表集合…是否有属性名为

Firstbox

的元素？“返回数组”？不，它不是一个

数组

它返回的对象与数组有很多共同点，但它肯定不是一个。好吧，它是一个节点列表，但对于一个乞丐来说，差异并没有真正意义。无论如何，我会把我的答案改得更具体一些。谢谢，我让它工作了，但是当我尝试分配框的值来检查字符串（输入）时，它不会检索值。我使用alert查看其中的内容，它会提醒[ObjectNodeList]。我试图从节点列表中检索该值，但运气不太好。。

var elem = document.getElementById('login');