JavaScript:addEventListener未运行

学习Javscript并尝试触发单击事件

我不确定我做错了什么，但下面的方法似乎不起作用

JSFiddle

HTML

---

firstChild

是一个文本节点，包含

li

start标记末尾和链接开头之后的空格。你需要第一个子元素

在许多浏览器上，这是

firstElementChild

，但是如果您需要对旧浏览器的支持，您可能需要一个循环

（使用

警报

而不是

打印

）

另一种选择是使用

querySelector

，它在所有现代浏览器上都可用（即使是IE8-但当然，IE8没有

addEventListener

）：

它查找第一个

元素，该元素是
#nav-item-39
的后代。如果您想要求它是直接子项，请使用选择器字符串
“#nav-item-39>a”


（为了完整性：
querySelector
查找第一个匹配元素并返回它[如果不匹配，则返回
null
）。还有
querySelectorAll
查找所有匹配元素并返回静态
节点列表
）


旁注：
print
，除非您重写它（我认为您在小提琴中不会这样做），否则它是
窗口。print
打开浏览器的打印对话框。
第一个孩子是一个文本节点，包含
li
开始标记和链接开始后的空白。你需要第一个子元素

在许多浏览器上，这是
firstElementChild
，但是如果您需要对旧浏览器的支持，您可能需要一个循环

（使用
警报
而不是
打印
）

另一种选择是使用
querySelector
，它在所有现代浏览器上都可用（即使是IE8-但当然，IE8没有
addEventListener
）：

它查找第一个
元素，该元素是
#nav-item-39
的后代。如果您想要求它是直接子项，请使用选择器字符串
“#nav-item-39>a”


（为了完整性：
querySelector
查找第一个匹配元素并返回它[如果不匹配，则返回
null
）。还有
querySelectorAll
查找所有匹配元素并返回静态
节点列表
）


旁注：
print
，除非您重写它（我认为您在小提琴中不会这样做），否则它是
窗口。print
将打开浏览器的打印对话框。
尝试使用firstElementChild而不是firstChild。
firstElementChild将防御性地返回元素，而firstChild也可以返回文本节点。
尝试使用firstElementChild而不是firstChild。
firstElementChild将防御性地返回元素，而firstChild也可以返回文本节点。
+1-还有
.children[0]
，这可能比
.firstElementChild
，我不记得了：-p+1-还有
.children[0]
，它可能比
.firstElementChild
有更好的支持，也可能没有，我记不起来了：-P
<ul>
    <li id="nav-item-39">
        <a href="#">Visit</a>
    </li> 
<ul>

var $visit = document.getElementById('nav-item-39').firstChild;

$visit.addEventListener('click', function() {
    print('hello');
});

var $visit = document.querySelector('#nav-item-39 a');

$visit.addEventListener('click', function() {
    print('hello');
});