如何通过父元素id更改子元素的类样式？

Question

例如,我有简单的HTML代码:

 <a id="news" href="#"><div class="" >News</div></a>

如何在纯javascript上用href的id更改div元素的类样式？或者可能更好地在类中为"a"元素描述div属性？( 怎么做？)

Answer 1

您可以使用"新闻"元素来引用getElementById.然后你可以找到div它childNodes并设置div的className属性.

例如,这将与您引用的HTML一起使用,以在元素上设置"foo"类:

document.getElementById("news").childNodes[0].className = "foo";

...因为div是"新闻"元素的第一个孩子.或者如果你想添加 "foo"类:

document.getElementById("news").childNodes[0].className += " foo";

另外值得一看querySelector和querySelectorAll,这是由支持大多数(但不是全部)的浏览器目前使用的(更多的支持).

如果您可能有其他元素,空格/文本节点等,您可能会看到getElementsByTagName而不是childNodes只读取您感兴趣的特定元素:

document.getElementById("news").getElementsByTagName('div')[0].className += " foo";

更多探索: