为什么弹出来的是a的地址，而不是<a></a>这个dom呢

Question

(function() {
  var resources = document.getElementById('resources');
  var links = resources.getElementsByTagName('a');
  var all = links.length;
  for (var i = 0; i < all; i++) {
    //循环绑定
    links[i].addEventListener('click', handler, false);

  };
  function handler(e) {
    var x = e.target; 
    alert('addEventListener绑定: '+ x);
    e.preventDefault();
  };
})();

为什么弹出来的是a的地址，而不是这个dom呢,我var x= this也是一样的

Answer 1

将

alert('addEventListener绑定: '+ x);

修改为：

alert('addEventListener绑定: '+ x.outerHTML);

原因

'addEventListener绑定: '+ x 其实等价于 'addEventListener绑定: '+ x.toString()

Answer 2

是因为js alert的时候会把内容toString()，还有就是字符串拼接的时候也会转换一下。你直接console.log(x)就会显示出该dom元素。

Answer 3

a.toString();

就是 a.href 了，所以不是问题，你可以用 typeof a 验证一下

alert('' + typeof x);

Answer 4

虽然通过隐式转换可以获取href，是个小技巧，但我觉得应该尽量避免这种晦涩的写法，影响可读性。
软件的维护时间比开发时间长的多，所以代码最好尽量简明自然。使用 linkDom.outerHTML/linkDom.getAttribute('href')类似的写法。