HTML5怎么实现按钮颜色变化,JS实现按钮颜色切换效果

Document

按钮1

按钮2

按钮3

//设置背景颜色

//如果设置参数函数会节省函数数量吧

//设置flag+参数函数

flag = "btn1";

function btn1(){

document.getElementById("btn2").style.color = "black";

document.getElementById("btn3").style.color = "black";

document.getElementById("btn1").style.color = "red";

}

function btn2(){

document.getElementById("btn1").style.color = "black";

document.getElementById("btn2").style.color = "red";

document.getElementById("btn3").style.color = "black";

}

function btn3(){

document.getElementById("btn1").style.color = "black";

document.getElementById("btn2").style.color = "black";

document.getElementById("btn3").style.color = "red";

}

function btn(num){

if(num == 1){

document.getElementById(flag).style.color = "black";

document.getElementById(flag).style.backgroundColor = "white";

document.getElementById("btn1").style.color = "red";

document.getElementById("btn1").style.backgroundColor = "blue";

flag = "btn1";

}

if(num == 2){

document.getElementById(flag).style.color = "black";

document.getElementById(flag).style.backgroundColor = "white";

document.getElementById("btn2").style.color = "red";

document.getElementById("btn2").style.backgroundColor = "blue";

flag = "btn2";

}

if(num == 3){

document.getElementById(flag).style.color = "black";

document.getElementById(flag).style.backgroundColor = "white";

document.getElementById("btn3").style.color = "red";

document.getElementById("btn3").style.backgroundColor = "blue";

flag = "btn3";

}

}