为什么当我用<a>纯 javascript 单击一个时，"this"返回一个 url 并且数组返回"undefined"？

Question

我没有使用像Jquery这样的库。这就是我所拥有的：

HTML:

<a href="#aid" class="nav-link"> A link </a>
<a href="#anotherid" class="nav-link"> Another link </a>
<a href="#oneidmore" class="nav-link"> One more link </a>

Javascript：

var links = document.getElementsByClassName("nav-link");
for(var i = 0; i < links.length; i++) {
    links[i].onclick = function(){
        alert(this); // Returns a url
        alert(links[i]); // Returns "undefined"
    };
};

我要查找的是获取我正在单击的相应元素。然后，获取href属性（只是包含的ID）等

我做错了什么？

PS：如果标题不好，很抱歉

编辑：

我做了一把JSfiddle：http://jsfiddle.net/2DRrJ/

Answer 1

this是<a>元素，URL是其.toString()值。

至于undefined link[i]，这是因为在循环执行结束时，i变量等于links.length，而links[links.length]实际上是undefined。这是JavaScript中作用域（和提升）工作方式的结果。