颜色变化代码:
HTML:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" type="text/css" href="web6.css"> <script type="text/javascript" src="web6.js"></script> <style type="text/css"> .red { 100px; height:100px; background: red; } .blue{ 100px; height:100px; background: blue; } </style> </head> <body> <div id="box" class="red">测试zhong</div> </body> </html>
JS
window.addEventListener('load',function(){ var box=document.getElementById('box'); box.addEventListener('click',toBlue,false); },false); function toRed() { this.className='red'; this.removeEventListener('click',toRed,false); this.addEventListener('click',toBlue,false); } function toBlue() { this.className='blue'; this.removeEventListener('click',toBlue,false); this.addEventListener('click',toRed,false); }
效果:
16:04:28 2017-09-02