javascript - 使用JS选择元素

var displayedImage = document.querySelector('.displayed-img');
var thumbBar = document.querySelector('.thumb-bar');

btn = document.querySelector('button');
var overlay = document.querySelector('.overlay');

/* Looping through images */
for(var i=1;i<=5;i++){
  var newImage = document.createElement('img');
  newImage.setAttribute('src', "images/pic"+i+".jpg");
  thumbBar.appendChild(newImage);
}

function getPath(){
    var path = this.document.getAttribute('src').value;
}
newImage.onclick=function(){

    var path = newImage.getAttribute('src');
    console.log(path);
    displayedImage.setAttribute('src', path);
}

我单击图像时尝试打印出路径，但它仅返回newImage的最后一个值。但是我有4张图片可供选择

最佳答案

为什么不将CSS类附加到每个图像元素，然后将类名称用作CSS选择器？像这样

newImage.className = 'my-class-name';