<html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div> <span onmouseover="demo('idDiv1')">111</span> <span> </span> <span onmouseover="demo('idDiv2')">222</span> </div> <div> <p id="idDiv1">qqqqqqqqqqqqqqqqqqqqqq</p> <p id="idDiv2" style="display:none">wwwwwwwwwwwwwwwwwwwwww</p> </div> <script language="javascript"> function demo(obj){ for(var i=1;i<5;i++){ var id=document.getElementById('idDiv'+i); if(id!=null){ id.style.display="none"; } } var idDiv=document.getElementById(obj); idDiv.style.display="block"; } </script> </body> </html>
1 <html> 2 <head> 3 <meta charset="utf-8"> 4 <title></title> 5 </head> 6 7 <body> 8 <div> 9 <span onmouseover="demo('idDiv1')">111</span> 10 <span> </span> 11 <span onmouseover="demo('idDiv2')">222</span> 12 </div> 13 <div> 14 <p id="idDiv1">qqqqqqqqqqqqqqqqqqqqqq</p> 15 <p id="idDiv2" style="display:none">wwwwwwwwwwwwwwwwwwwwww</p> 16 </div> 17 <script language="javascript"> 18 //方法一 19 function demo(obj){ 20 for(var i=1;i<5;i++){ 21 var id=document.getElementById('idDiv'+i); 22 if(id!=null){ 23 id.style.display="none"; 24 } 25 } 26 var idDiv=document.getElementById(obj); 27 idDiv.style.display="block"; 28 } 29 //方法二 获取所有的ID,并比较是哪个id选中，则其他id不显示 30 </script> 31 </body> 32 </html>