.getElementById('').getElementById('').style不起作用

Question

使用Javascript

document.getElementById('menu').getElementById('line1').style.opacity = "0";

HTML

<a href = "#"><div id = "menu" onclick="menu()">
            <div id = "line1">1</div>
            <div id = "line2">1</div>
            <div id = "line3">1</div>
        </div></a>

所以我试图让第一行消失,但由于某种原因它不会运行.我的语法有问题吗？我有额外的.getElementById('menu')的原因是因为我有div id ="menuClose"返回原来的.除非有另一种方式？

Answer 1

你为什么先选择菜单？您可以直接选择该行,因为它由ID标识:

document.getElementById('line1').style.opacity = "0";

JsFiddle在这里.

如果你想改变另一个div中包含的所有div(在你的情况下包含div中包含的所有div id="menu"),请使用document.getElementById('menu').childNodes然后迭代,如此SO帖子所示