javascript - How to get the previous and next values ​​of the click event.

Question

for (var i = 0; i < pic.length; i++) {
        pic[i].onclick = function () {
            var aA = this.getAttribute("href");
            return false;
        }
    }

The for loop has been traversed to bind the click event. When you click on picture 1, you can already get the value of href in the label (note: href is the jump link in the A label, return false is to not jump), now I want to get the href value of the previous label and the next label when the current pattern is clicked, so that the middle picture displays pattern 1, the left pattern displays pattern 4, and the right pattern displays pattern 2. How to do this?

Answer 1

for (var i = 0; i < pic.length; i++) {
    pic[i].index=i;
    pic[i].onclick = function () {
        var aA = this.getAttribute("href");
        //如果当前是第一个，没有上一个，值获取下一个
        if(this.index===0){
            var aANext=pic[this.index-1].getAttribute("href");
        }
        //如果当前是最后一个，没有下一个，只获取上一个
        else if(this.index===pic.length-1){
             var aAPrev=pic[this.index-1].getAttribute("href");
        }
        //否则上下都获取
        else{
            var aAPrev=pic[this.index-1].getAttribute("href");
            var aANext=pic[this.index-1].getAttribute("href");
        }
        
        
        return false;
    }
}

Answer 2

Thank you, your method is very good. You set an index attribute on the element and adjacent elements. I understand.
This is how I write it now, but I still need to figure out how to make the point appear first. The fourth picture
<script>

var pic = document.getElementById('pic').getElementsByTagName('a');
var pid = document.getElementById('pid').getElementsByTagName('img');
for (var i = 0; i < pic.length; i++) {
    pic[i].onclick = function () {
        var aA = this.getAttribute("href");
        var pid = document.getElementById('pid');
        pid.setAttribute("src", aA);
        var aB = this.parentNode.previousSibling.firstChild.getAttribute('href')
        pid.previousSibling.setAttribute('src', aB);

        var aC = this.parentNode.nextSibling.firstChild.getAttribute('href')
        pid.nextSibling.setAttribute('src', aC);

        return false;
    }
}

</script>