??JavaScript瀛??绗?璁般??锛?榧?????绀烘?
?ㄦ??浠???璁稿??婚?????㈤?戒???榧?????绀烘???搴????渚?濡?涓??㈢?????懼氨??涓?涓?姣?杈?濂界??渚?瀛?锛?
涓??㈡??浠?灏卞???拌?涓?姣?杈?绠?????渚?瀛?
杩?涓???瀹??闆????姣?杈?绠???锛?濡?涓?锛?
1??褰?榧???绉誨?ㄥ??heckbox涓??㈡?訛???绀烘??虹?般??
2??褰?榧???绉誨??heckbox?訛???绀烘?灏辨?澶便??
榧???绉誨?ュ??绉誨?哄?瑰???浜?浠朵負锛?onmouseover/onmouseout
?虹?闆??娑?澶卞??iv涓??㈢??琛ㄧ?闆艦寮?涓猴?divName.style.display=??block?? ;divName.style.display=??none?? (divName涓烘??绛?iv??id)
?蜂?浠ｇ??濡?涓?锛?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>????棰???妗?lt;/title>
</head>
<style>
#div1 {width:px;height:px;background:red;border:px;display:none;}
</style>
<body>
<input type="checkbox" value="榧?????绀烘?" onmouseover="div1.style.display='block'"; onmouseout="div1.style.display='none'"/>
<div id="div1">
涓轟?浣???瀹????璇蜂?瑕??ㄥ???辯?佃??涓?淇?瀛?瀵???
</div>
</body>
</html>
涓??㈢?存?ヤ嬌?ㄦ??绛?iv??id??绉?iv1?ヤ?涓哄?矽薄杩?琛?涓?浜???浣?锛??ㄦ????娴?瑙??ㄤ腑锛?杩?绉???浣???涓??借揪?版??浠???瑕?姹???锛???姝わ???浠??村?????浣跨???
??姝わ?涓??㈢??浠ｇ??灏辨?存?逛負锛?
<style>
#div1 {width:px;height:px;background:red;border:px;display:none}
</style>
<body>
<input type="checkbox" onmouseover="document.getElementById('div1').style.display='block';" onmouseout=" document.getElementById('div1').style.display='none';"/>
<div id="div1">
涓轟??ㄧ??瀹????璇蜂?瑕??ㄥ???辯?佃??涓?淇?瀛??ㄧ??瀵???锛?锛?锛?
</div>
</body>
??涓??㈢??浠ｇ????浠?涔???浠ョ?ㄥ?芥?版?ヨ?琛?瀹??般??
濡?涓?寮??ヤ?涓や釜?芥?幫?????涓?ppear()??disappear()锛?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>????棰???妗?lt;/title>
</head>
<style>
#div1 {width:px;height:px;background:red;border:px;display:none;}
</style>
<script>
function appear()
{
var oDiv=document.getElementById('div1');
oDiv.style.display="block";
}
function disappear()
{
var oDiv=document.getElementById('div1');
oDiv.style.display="none";
}
</script>
<body>
<input type="checkbox" onmouseover="appear()" onmouseout="disappear()" />
<div id="div1">
涓轟??ㄧ??瀹????璇蜂?瑕??????卞?烘??淇?瀛??ㄧ??瀵???锛?锛?锛?
</div>
</body>
</html>
?ㄤ??㈢??浠ｇ??涓?锛???浠?浣跨?ㄤ?涓や釜?芥?幫?浣????ㄤ袱涓??芥?扮??浠ｇ??涓?锛??烘??涓??鳳???姝わ???浠?涔?灏卞??浠ラ???╀嬌?ㄥ甫涓?涓????扮???芥?版?ュ???幫?濡?涓?锛?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>????棰???妗?lt;/title>
</head>
<style>
#div1 {width:px;height:px;background:red;border:px solid:;display:none;}
</style>
<script>
function change(content)
{
var oDiv=document.getElementById('div1');
oDiv.style.display=content;
}
</script>
<body>
<input type="checkbox" onmouseover="change('block');" onmouseout="change('none')" />
<div id="div1">
涓轟??ㄧ??瀹????璇鋒?ㄥ?ㄥ???卞?哄??涓?瑕?淇?瀛?瀵???锛?锛?锛?
</div>
</body>
</html>
灏?缁?
濂芥?浜轟?锛???reamWeaver杞?浠惰?琛?html??浠剁??缂???锛?褰???浠?????绛劇????涓?灞??ф??????灞??у?兼?煎????璇????跺??灞??舵病????绀轟?锛????跺????宸卞??涓鴻?涓?????浜???娌℃??杈懼?版??浠??????芥????锛?妫??ュ?村???版???煎????璇?锛???????濂借???間?
![主流浏覽器四大綜合性能測試[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)