<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>选项卡</title> <style type="text/css"> #xs .active { background:pink; } #xs div { width:200px; height:200px; background: dodgerblue; display: none; } </style> <script type="javascript"> window.onload=function () { var a1=document.getElementById('xs'); var a2=a1.getElementsByTagName('input'); var a3=a1.getElementsByTagName('div'); for (var i=0; i<a2.length; i++) { a2[i].index=i; a2[i].onclick=function () { for (var j=0; j<a2.length; j++) { a2[j].className=''; a3[j].style.display='none'; } this.className='active'; } a3[this.index].style.display='block'; } } </script></head><body> <div id="xs"> <input type="button" value="周一"/> <input type="button" value="周二"/> <input type="button" value="周三"/> <input type="button" value="周四"/> <div style=display:block;>今天是星期一!</div> <div >今天是星期二!</div> <div >今天是星期三!</div> <div >今天是星期四!</div> </div></body></html>
添加回答
举报
0/150
提交
取消