数组中的Javascript样式元素

我有一个图像数组，我想在每次单击这些图像时使用边框来设置它们的样式。我可以使用一个索引号来设置一个图像的样式，但似乎无法在每次单击图像时在每个图像上运行该函数。我得到一个“无法设置未定义的'border'属性” 在HTMLImageElement.picStyle中

HTML:

JS:

var dogPics=document.getElementsByClassName（'dogImg'）；
函数picStyle（）{
dogPics.style.border=“1px纯黑”；
}
对于（变量i=0；i

使用

此.style.border

而不是

dogPics.style.border

var dogPics=document.getElementsByClassName（'dogImg'）；
函数picStyle（）{
this.style.border=“1px纯黑”；
}
对于（变量i=0；i

可能重复感谢！从你的回答中学到了很多。@1024很高兴它有帮助。

<div id="pic-container">
    <img class ="dogImg" src="img/dog1.jpg">
    <img class ="dogImg" src="img/dog2.jpg">
    <img class ="dogImg" src="img/dog3.jpg">
    <img class ="dogImg" src="img/dog4.jpg">
    <img class ="dogImg" src="img/dog5.jpg">
</div>

var dogPics = document.getElementsByClassName('dogImg');

function picStyle() {
   dogPics.style.border = "1px solid black";
   }


for (var i = 0; i < dogPics.length; i++) {
   dogPics[i].addEventListener('click' , picStyle ) ; 
}