Good morning sir. I want to go to my next profil tableau [1] with button. Thanks you sir.

Question

Going next profil.
https://code.sololearn.com/WVXTJIGr025Y/?ref=app

Answer 1

You only have one <img> element in HTML at line 9.

You initialized tableau[0] by assigning a reference to the only one <img> you have.

tableau [0] = document.querySelector ("img");

And modified its 'src' attribute

tableau [0].setAttribute ("src","https://mimo.app/ih/panda.png");

There is no tableau[1] cause you haven't initialized it. Your attempt to modify 'src' attribute of a non existing array element triggered an error.

tableau [1].setAttribute ("src","https://mimo.app/i/kittles.png"); // non existing array element.

* Possible solution:
- Add another <img> in HTML section
- Collect the <img> elements using querySelectorAll() before replacing the 'src' attribute value.

const tableau = document.querySelectorAll( "img" );
tableau[ 0 ].src = ...;
tableau[ 1 ].src = ...;

* Please use relevant tags

https://code.sololearn.com/W3uiji9X28C1/?ref=app

Answer 2

// I improved your code it should hopefully work now.

let img = document.querySelector ("img");
var curr = 0;

const tableaus = [
"https://mimo.app/i/cat.png",
"https://mimo.app/i/panda.png",
"https://mimo.app/i/kittles.png"
];

function changeProfile() {
curr++;
if (curr >= 3) curr=0;
img.setAttribute ("src",tableaus[curr]);
}

function timer(){
changeProfile()
}

window.onload = function() {
setInterval(timer, 3000); // 3 seconds
}