本文實例講述了JavaScript實現的開關燈泡點擊切換特效。分享給大家供大家參考,具體如下:
準備
首先要準備兩張圖片,一張是燈泡亮的圖片,取名為on.jpg,另一張是滅的圖片,取名為off.jpg,都放置到當前的目錄下。
代碼
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title></title> <link rel="stylesheet" href=""> <script> function change(){ var img = document.getElementById('img'); var src = img.src; if(src.indexOf('on') >=0 ){ img.src = 'off.jpg'; }else{ img.src = 'on.jpg'; } } </script></head><body> <h1>開關燈泡</h1> <img id='img' src="on.jpg" onclick="change();" width='200' height="200"></body></html>
運行結果圖
更多關于JavaScript相關內容感興趣的讀者可查看本站專題:《JavaScript切換特效與技巧總結》、《JavaScript查找算法技巧總結》、《JavaScript動畫特效與技巧匯總》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
新聞熱點
疑難解答