The Student Room Group
Competition - post a photo you've taken of nature >>
Competition - post a photo you've taken of nature >>
Competition - post a photo you've taken of nature >>

What is the problem with this code OCR computer Science

<!DOCTYPE html>
<html>
<head>
<title> Task 3 </>
</head>

<button type = "button" onclick="Switch()">Change Lights</button>
<img id="img" src="red.jpg"

<script>
var images = [], x=-1:
images[0] = "red.png"
images[1] = "yellow.png"
images[2] = "green.png"


function Switch() {
x = (x===images.length - 1 ) ? 0 : x+1
document.getElementById ("img").src = images[x]

</script>
</body>
</html>
Reply 1
Avatar for amrit_sv
amrit_sv
7
Original post by Man_Like_$
<!DOCTYPE html>
<html>
<head>
<title> Task 3 </>
</head>

<button type = "button" onclick="Switch()">Change Lights</button>
<img id="img" src="red.jpg"

<script>
var images = [], x=-1:
images[0] = "red.png"
images[1] = "yellow.png"
images[2] = "green.png"


function Switch() {
x = (x===images.length - 1 ) ? 0 : x+1
document.getElementById ("img").src = images[x]

</script>
</body>
</html>


Hi, you had a number of syntax errors which I have corrected for you below. Im assuming the path to your images is correct otherwise it still will not work so check that please.

You have also changed the file extension to .png when you add the images to the array so i changed them back to jpg but again just make sure the file path and file name are correct.

I assumed you wanted the switch function to loop through red, yellow and green so I have corrected that logic for you. Let me know if you still need any help.

<!DOCTYPE html>
<html>
<head>
<title>Task 3</title>
</head>
<body>
<button onclick="Switch()" >Change Lights</button> <img id="img" src="red.jpg">

<script>
var images = [], x=0;
images[0] = "red.jpg"
images[1] = "yellow.jpg"
images[2] = "green.jpg"


function Switch () {
x + 1 > images.length - 1 ? x = 0 : x += 1
console.log(x)
document.getElementById("img").src = images[x]
}
</script>
</body>
Reply 2
Avatar for Man_Like_$
Man_Like_$
OP
12
Original post by amrit_sv
Hi, you had a number of syntax errors which I have corrected for you below. Im assuming the path to your images is correct otherwise it still will not work so check that please.

You have also changed the file extension to .png when you add the images to the array so i changed them back to jpg but again just make sure the file path and file name are correct.

I assumed you wanted the switch function to loop through red, yellow and green so I have corrected that logic for you. Let me know if you still need any help.
<!DOCTYPE html>
<html>
<head>
<title>Task 3</title>
</head>
<body>
<button onclick="Switch()" >Change Lights</button> <img id="img" src="red.jpg">

<script>
var images = [], x=0;
images[0] = "red.jpg"
images[1] = "yellow.jpg"
images[2] = "green.jpg"


function Switch () {
x + 1 > images.length - 1 ? x = 0 : x += 1
console.log(x)
document.getElementById("img":wink:.src = images[x]
}
</script>
</body>

Thanks it now works
Reply 3
Avatar for amrit_sv
amrit_sv
7
Original post by Man_Like_$
Thanks it now works


Just some pointers:

•

Make sure to close all tags e.g <h1> </h1>

You can delete the console.log(x) line its just there to show you the index of the array.

When using ternary operator, the equivalent in an if else statement would be:


if ((x + 1) > images.length) {
x = 0;
} else {
x += 1;
}

Quick Reply

Related discussions

Latest

Trending

Trending

Articles for you