サマリー:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0">&
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="../../demo/js/jq_3.3.1_mi.js"></script>
<title>Document</title>
</head>
<body>
<script>
$(document).ready(function(){
$('div').hover(function(){
$(this).css('background','red')
},function(){
$(this).css('background','#ff6500')
})
$('button').click(function(){
$('img').toggle('src')
})
})
</script>
<div style="width:50px;height:50px;background:#ff6500;">我是正方形</div>
<div style="width:190px;height:24px;border: 1px solid #ff6500"><img src="../images/12.png" alt=""></div>
<button>點(diǎn)擊</button>
</body>
</html>
總結(jié):
1、案例中hover事件能使鼠標(biāo)以上div上時(shí),實(shí)現(xiàn)背景切換效果
2、toggle事件能實(shí)現(xiàn)圖片的隱藏顯示切換效果
添削の先生:滅絕師太添削時(shí)間:2019-02-16 17:40:47
先生のまとめ:完成的不錯(cuò),作業(yè)可以將學(xué)到的知識運(yùn)用到實(shí)例