从所有链接更改颜色

Question

我想通过<ul class="menu">所有链接更改颜色，但这并没有为我更改颜色。 我是javascript的入门者，正在做一些练习。

我的<ul class="menu"> ：

<ul class="menu">
<li><a href="">hello</a></li>
<li><a href="">hello</a></li>
<li><a href="">hello</a></li>
<li><a href="">hello</a></li>

我在JavaScript中做错了什么？

        var x=document.getElementByClass("menu");
        if(x){
            var e =x.getElementsByTagName("a");
            for(var i=0; i<e.length; i++){
                e[i].style.color='yellow';
            }
        }

Answer 1

您需要调用的函数是getElementsByClassName 。 它返回一个NodeList ，因此您必须遍历结果。

var menus = document.getElementsByClassName("menu");
for (var j = 0; j < menus.length; j++) {
    var e = menus[j].getElementsByTagName("a");
    for(var i=0; i<e.length; i++){
        e[i].style.color='yellow';
    }
}

jsFiddle

Answer 2

我建议您查看一些开发工具（例如，firebug），这些工具可用于您正在使用的任何浏览器。 他们中的许多人都有一个控制台，可让您在正在查看的当前页面上运行javascript。

如果您尝试在Firebug控制台中运行代码（这只是我最熟悉的代码），那么它会给您一个错误，告诉您getElementByClass不是函数。

如果没有其他问题，这样做可以帮助您至少了解JavaScript的错误所在。

但是，是的，您的问题是您正在寻找函数getElementsByClassName而不是getElementsByClass。

另外，我假设您想要在锚标记中添加“ hello”：

<ul class="menu">
<li><a href="">Hello</a></li>
<li><a href="">hello</a></li>
<li><a href="">hello</a></li>
<li><a href="">hello</a></li>

Answer 3

您正在寻找的功能是： getElementsByClassName()

var x=document.getElementsByClassName("menu");