先上代碼：
<html>
<head>
<title>js操作</title>
<style>
.div_in{
width:330px;
height:165px;
}
.div_in2{
width:321px;
height:20px;
padding:18px 0 17px 0;
line-height:22px;
font-size:14px;
border: 1px solid rgb(234, 238, 237);
}
.div_meau1{
display:inline-block;
padding-left:15px;
font-size:18px;
font-weight:500;
padding:0 8px;
vertical-align:top;
}
.div_meau2{
margin:0 5px 5px 0;
padding:0 8px;
display:inline-block;
vertical-align:top;
}
.div_tag1{
width:200px;
height:400px;
margin-top:-50px;
margin-left:322px;
border: 1px solid rgb(234, 238, 237);
display:none;
}
</style>
<script type="text/javascript">
function myClickshow(one){
var event=document.getElementById(one);
event.style.display="block";
}
function myClickhide(one){
var event=document.getElementById(one);
event.style.display="none";
}
</script>
</head>
<body>
<div class="div_in">
<div class="div_in2" onmouseout="myClickhide('one1')" onmouseover="myClickshow('one1')">
<div class="div_meau1">技術</div>
<div class="div_meau2">Java</div>
<div class="div_meau2">PHP</div>
<div class="div_meau2">C++</div>
<div class="div_meau2" style="margin-left:10px;">區塊鍊</div>
<img src="logo.png" />
<div id="one1" class="div_tag1">
<div style="padding-left:15px;font-size:18px;font-weight:500;padding:5 8px;">後端開發</div>
<div class="div_meau2">Java</div>
<div class="div_meau2">PHP</div>
<div class="div_meau2">C++</div>
<div class="div_meau2">C#</div>
<div class="div_meau2">資料挖掘</div>
</div>
</div>
</div>
</body>
</html>
效果圖：
未将滑鼠移至塊上：
将滑鼠移至塊上：
div關鍵代碼：當有滑鼠放置在該div上時，調用myClickshow()函數。當滑鼠離開該div上時，調用myClickhide()函數。<div id="one1" class="div_tag1" onmouseout="myClickhide('one2')" onmouseover="myClickshow('one2')">
script關鍵代碼：<script type="text/javascript"> function myClickshow(one){ var event=document.getElementById(one); event.style.display="block"; } function myClickhide(one){ var event=document.getElementById(one); event.style.display="none"; } </script>myClickshow接受傳遞的參數one，調用getElementById()方法，得到div的拷貝，指向真正的div塊。更改div的display屬性為 block ，即可顯現出來。
myClickhide接受傳遞的參數one，調用getElementById()方法，得到div的拷貝，指向真正的div塊。更改div的display屬性為 none ，即可隐藏。