代码及注释:
// TODO:完善此函数 显示红色颜色的灯
function red() { //将红色图片元素display显示出来,其他隐藏
document.querySelector('#defaultlight').style.display = 'none'
document.querySelector('#redlight').style.display = 'inline-block'
document.querySelector('#greenlight').style.display = 'none'
}
// TODO:完善此函数 显示绿色颜色的灯
function green() {
document.querySelector('#defaultlight').style.display = 'none'
document.querySelector('#redlight').style.display = 'none'
document.querySelector('#greenlight').style.display = 'inline-block'
}
// TODO:完善此函数
function trafficlights() {
setTimeout(red(), 3000) //3秒后执行变红函数
setTimeout(green(), 6000)
}
trafficlights();
知识点:
1.延时器 setTimeout()
指定毫秒数之后调用函数,只执行一次
2.定时器 setInterval()
指定毫秒数为周期不断调用函数,直到clearInterval()被调用或窗口关闭,setInterval()会返回一个id值可作为clearInterval()的参数