JavaScript和x27之间的区别是什么；s getElementById（）和getElementsByName（）函数？

我的简短研究告诉我，后者将返回一个集合，而不是一个ID已传递的元素

考虑以下代码：

function validateAllFields()
{
var clientid = document.getElementById("clientid");
var programs = document.getElementById("programs");
var startmonth = document.getElementById("startmonth");
var startday = document.getElementById("startday");
var startyear = document.getElementById("startyear");
var completed = document.getElementsByName("completed");
var goals = document.getElementsByName("goals");
var errors = document.getElementById("errorMsg");
errors.innerHTML = "";

if(isNumeric(clientid, errors, "Please enter a valid client ID")){
    if(madeSelection(programs, errors, "Please select a program from the drop-down list")){
        if(madeSelection(startmonth, errors, "Please enter a month for the start date")){
            if(madeSelection(startday, errors, "Please enter a day for the start date")){
                if(madeSelection(startyear, errors, "Please enter a year for the start date")){
                    if(checked(completed, errors, "Please choose an option that indicate whether the client has completed the program")){
                        if(checked(goals, errors, "Please choose an option that indicate whether the client has met his/her goals.")){
                            window.alert("GOT IN TO  RETURN TRUE");
                            return true;
                        }
                    }
                }
            }
        }
    }
}
return false;
}
</script>

---

在我将这些元素更改为使用getElementById（）之后，我的代码现在就可以工作了，我只是想知道为什么getElementsByName会出现这种行为

名称属性不是设计为唯一的，而id属性是唯一的

<div name="nonUnique" />
<div id="unique" />

^^^^       ^^

---

按元素的

名称

获取元素，按元素的

id

获取元素。一个页面上可能有许多元素具有相同的

名称

（因此

getElementsByName

总是返回元素列表），但（必须）只有一个元素具有给定的

id

（因此

getElementById

只返回一个元素）。

为了不提交表单，return false需要返回（您说您使用了onsubmit处理程序）

---

在代码的第二行中，由于getElementsByName确实返回了一个选择（它将与.getElementsByName（“test”）[0]一起使用），因此会抛出一个js错误。其余的代码不会执行，因此不会返回任何内容，表单会完全通过其余的验证。

方法返回一个数组，当您试图调用

元素.focus（）

时，您会遇到一个错误，因为数组上没有

focus

方法。当事件处理程序中出现错误时，它不会阻止表单发布

---

如果您使用

GetElementById

您应该使用

element

来访问元素，如果您使用

GetElementsByName

您应该使用

element[0]

GetElementById方法一次只能访问一个元素，即具有指定ID的元素。getElementsByName方法不同。它收集具有指定名称的元素数组。可以使用从0开始的索引访问各个元素

getElementById

• 它将只为您获取一个元素
• 该元素具有您在getElementById（）的括号内指定的ID

getElementsByName

• 它将得到一个名称相同的元素集合
• 每个元素都以一个从0开始的数字作为索引，就像数组一样
• 通过将其索引号放入下面getElementsByName语法的方括号中，可以指定要访问的元素

功能测试（）{
var str=document.getElementById（“a”）.value；
console.log（str）；
var str1=document.getElementsByName（“a”）[0]。值；
控制台日志（str1）；
var str2=document.getElementsByName（“a”）[1]。值；
控制台日志（str2）；
}

单击此处

对已经提供的答案进行一点扩展，在浏览器DOM早期提供了name属性，以允许表单中的元素内容参照该name属性提交，从而可以将参数传递给服务器端的CGI脚本。这可以追溯到更现代的通过JavaScript引用DOM元素来操纵样式的能力之前

当DOM被扩展以允许上述现代操作时，添加了id属性，以便可以随意操作单个元素。当您想要执行DOM操作时，您可以通过id属性选择要操作的元素（如果您只对操作单个DOM元素感兴趣），或者通过class属性（由您自己适当设置）选择要操作的元素（如果您想要以相同的方式一起操作多个元素）。在后一种情况下，您可以将class属性设置为多个值（名称字符串由空格分隔），以便可以指定元素属于多个类，并相应地执行操作。您可以随意混合和匹配id和类属性，只要您注意避免名称冲突

例如，您的网页上可以有五个按钮，全部设置为：

class=“Set1”

并更改所有这些按钮的样式，首先使用以下语句：

myButtons = document.getElementsByClassName("Set1");

要获取与按钮对应的元素对象数组，请运行以下循环：

for (i=0; i<myButtons.length; i++)
    myButtons[i].style.color="#FF0000";

将集合中的一个按钮的背景色设置为黄色，表示该按钮用于集合中的特殊功能

---

简言之，表单提交时使用name属性，引用要对其执行DOM操作或将事件处理程序附加到的元素时使用id和class属性。

您的意思是getElementsByTagName（）？@kinakuta-不，他没有：您的代码中有这么多缩进。考虑每次检测到的错误后返回false，如果没有错误，则返回true。这就是当人们说PHP很混乱时我笑的地方。。。很好的注释ZeccIn特别是，“radio”类型的输入如果属于同一组，则共享相同的名称。请注意，

name

不是

上的有效属性。可能值得一提的是IE的一个怪癖-如果使用getElementByID（“a_name”），如果ID不存在，它将按名称返回元素。在其他浏览器中，它将失败，因此可能是一种奇怪的调试体验。这应该是标记的答案

myButtons = document.getElementsByClassName("Set1");

for (i=0; i<myButtons.length; i++)
    myButtons[i].style.color="#FF0000";

ref = document.getElementById("Special");
ref.style.backgroundColor = "#FFFF00";