jQuery是一款非常流行的JavaScript庫,可以幫助我們快速地開發(fā)各種各樣的交互性功能。今天,我們來看一下如何使用jQuery通過點(diǎn)擊某個(gè)div來顯示圖片。
//HTML代碼 <div id="showImg">點(diǎn)擊這里顯示圖片</div> <img src="image.jpg" alt="圖片"> //CSS代碼 img{ display:none; } //jQuery代碼 $(document).ready(function(){ $("#showImg").click(function(){ $("img").show(); }); });
上面的代碼中,我們首先定義了一個(gè)id為"showImg"的div,以及一張圖片。通過CSS的display:none樣式,我們讓圖片在頁面加載的時(shí)候不可見。
接著,在jQuery代碼中,我們使用了.click()方法來綁定了一個(gè)點(diǎn)擊事件。當(dāng)我們點(diǎn)擊id為"showImg"的div時(shí),就會(huì)執(zhí)行show()方法使圖片顯示出來。
這樣,我們就實(shí)現(xiàn)了一個(gè)簡(jiǎn)單的圖片顯示功能。當(dāng)然,你可以通過CSS樣式和jQuery方法來實(shí)現(xiàn)更多更豐富的效果。