javascript - 为什么索引不能替代e.target？

Question

所以我不明白为什么以下不起作用，因为我用divs [i]来引用它自己。它只适用于我使用e.target（显示在下一个代码中）。我知道e.target是指元素本身，为什么不呢？ div [i]在这种情况下工作？

  var divs = document.querySelectorAll('div');
  for(var i = 0; i < divs.length; i++) {
    divs[i].onclick = function() {
      divs[i].style.backgroundColor = bgChange();
    }
  }

e.target的代码

  for(var i = 0; i < divs.length; i++) {
    divs[i].onclick = function(e) {
      e.target.style.backgroundColor = bgChange();
    }
  }

参考代码

for (var i = 1; i <= 16; i++) {
  var myDiv = document.createElement('div');
  document.body.appendChild(myDiv);
}

function random(number) {
  return Math.floor(Math.random() * number);
}

function bgChange() {
  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
  return rndCol;
}
var divs = document.querySelectorAll('div');
for (var i = 0; i < divs.length; i++) {
  divs[i].onclick = function(e) {
    e.target.style.backgroundColor = bgChange();
  }
}

div {
  background-color: red;
  height: 100px;
  width: 25%;
  float: left;
}