如何选择纯javascript链接的锚点

Question

所以如果我有这样的DOM：

<div id="foo">
<ul><li><a href="#"></a></li></ul>
</div>

我明白要抓住我会做的div

   document.getElementById("foo");

但我怎么能抓住一个？我正在尝试将一个类添加到a href。

ME =被jQuery破坏

Answer 1

您唯一可以选择的是标签名称（a）。您可以使用getElementsByTagName方法：

var el = document.getElementsByTagName('a')[0];
el.className = 'foo';

请注意[0]选择getElementsByTagName找到的第一个元素。显然，这可以返回多个元素。

如果您想在#foo内搜索，可以这样做：

var foo = document.getElementById('foo'),
    el = foo.getElementsByTagName('a')[0];

这表明您可以使用getElementsByTagName在另一个元素的上下文中进行搜索。

---

所有浏览器（即Firefox 3或之前，IE 7或之前版本）不支持的最后一种方法是querySelectorAll，它允许您像在jQuery中一样使用CSS选择器。例如：

var el = document.querySelectorAll('#foo a')[0];