如何通过类名获取元素而不是“GetElementById”？

Question

所以，这是代码：

<a id="link" href="https://url.com/">URL:</a>
<input id="value"/>

<script type="text/javascript">
    var link= document.getElementById('link');
    var input= document.getElementById('value');
    input.onchange=input.onkeyup= function() {
        link.search= 'extendurl/'+encodeURIComponent(input.value);
    };
</script>

这个可以工作，但是我需要使用类(class)代替ID。我尝试了这个:

<script type="text/javascript">
    var link= document.getElementByClassName("link")[0];
    var input= document.getElementByClassName("value")[0];
    input.onchange=input.onkeyup= function() {
        link.search= 'extendurl/'+encodeURIComponent(input.value);
        link.firstChild.data= link.href;
    };
</script>

<a class="link" href="https://url.com/">URL:</a>
<input class="value"/>

我不知道为什么，但这不能工作。

有人能帮忙吗？

- Fábio Pavani

---

https://dev59.com/bXI-5IYBdhLWcg3wR2Nr?rq=1 - Matt Ball

在发布新问题时，请阅读“可能已经有您答案的问题”部分。 - Esteban

Answer 1

准确的名称很重要。

更改

getElementByClassName

为了

getElementsByClassName

之所以有一个s，是因为可能会有多个具有相同类的元素，与具有特定 id 的元素相反。

- Denys Séguret

---

不要忘记投票关闭。 - Rob W

@RobW 完成了。我很惊讶你找到了这个的重复... - Denys Séguret

@dystroy 这是一个常见的打字错误，我刚刚在谷歌上搜索了一下：site:stackoverflow.com getElementByClassName，并在第三个结果中找到了这个答案。 - Rob W

Answer 2

有许多元素可能具有完全相同的类名，因此您需要为此进行调整

而不是

getElementByClassName

你需要做的是：

getElementsbyClassName("someclass");

它将返回所有这些的数组。

- scrblnrd3