Olá, no seguinte exercício, deve haver 3 buttons, sendo que clickando em cada um, mudará a cor do body pela cor indicada no botão(usando a mesma função para todos), porém minha tentativa foi falha, gostaria de saber porque, segue a baixo o enunciado do exercício e minha tentativa:
1)Os elementos devem alterar a cor de fundo da página, quando clicados de acordo com a respectiva cor. Apresente o javascript necessaro para que isso funcione.
button id=”azul”>Azul
button id=”verde”>Verde
button id=”vermelho”>Vermelho
html:
<html>
<head>
<meta charset = "utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href = "./css/style.css">
<title>Meu Site</title>
</head>
<body>
<main>
<button id=”azul” onclick="trocarcor(id)">Azul</button>
<button id=”verde” onclick="trocarcor(id)">Verde</button>
<button id=”vermelho” onclick="trocarcor(id)">Vermelho</button>
</main>
<script src="./scripts/app.js"></script>
</body>
Javacript:
function trocarcor(id) {
if (id == "vermelho") {
document.getElementsByTagName("body")[0].style.background = "red"
}
else if(id == "azul"){ document.getElementsByTagName("body")[0].style.background = "blue"}
else if(id == "verde"){ document.getElementsByTagName("body")[0].style.background = "green"}
console.log(id)}
console.log
do id?