javascript 通过 id 获取 child

Question

<div onclick="test(this)">
    Test
    <div id="child">child</div>
</div>

我想在单击父 div 时更改子 div 的样式。我如何引用它？我希望能够通过 ID 引用它，因为父 div 中的 html 可能会更改并且 child 不会成为第一个 child 等。

function test(el){
  el.childNode["child"].style.display = "none";
}

类似的东西，我可以通过 id 引用子节点并设置它的样式。

谢谢。

编辑:ID 必须是唯一的。所以让我稍微修改一下我的问题。我不愿意为添加到页面的每个元素创建唯一的 ID。父 div 是动态添加的。 (有点像页面注释系统)。然后是这个子 div。我希望能够做这样的事情:el.getElementsByName("options").item(0).style.display = "block";

如果我用 document 替换 el，它工作正常，但它不适用于页面上的每个“选项”子 div。然而，我希望能够单击父 div，并让子 div 做一些事情(例如离开)。

如果我必须动态创建一百万个(夸张的)div ID，我会的，但我宁愿不这样做。有什么想法吗？

Answer 1

在现代浏览器(IE8、Firefox、Chrome、Opera、Safari)中，您可以使用 querySelector() :

function test(el){
  el.querySelector("#child").style.display = "none";
}

对于旧版浏览器 (<=IE7)，您必须使用某种库，例如 Sizzle或框架，例如 jQuery , 与选择器一起工作。

如前所述，ID 在文档中应该是唯一的，因此最简单的方法是使用 document.getElementById("child")。