HTML和JS是兩個廣泛應用的技術,HTML負責網頁的結構和展示,而JS則用于網頁的交互和動態效果實現。在HTML中引入JS代碼可以為網頁帶來更多的交互、動態效果以及更豐富的功能。
<script type="text/javascript">//引入JS代碼 function showMessage(){ alert("這是一條提示信息"); } showMessage(); </script>
上述JS代碼實現了一個簡單的提示框功能,其中使用了script標簽,type為text/javascript,表示引入JS代碼,通過定義一個showMessage()函數來彈出提示框。
另外一個應用JS的場景是使用JS庫,例如jQuery就是一個很流行的JS庫,可以通過引入jQuery庫的js文件,來方便地使用一系列的jQuery功能。下面是一個使用jQuery實現鼠標懸停事件的例子。
<!DOCTYPE html><html><head><title>jQuery豐富Web界面</title><script src="https://cdn.bootcss.com/jquery/3.5.1/jquery.min.js"></script><script>$(document).ready(function(){ $("p").hover(function(){ $(this).css("background-color", "yellow"); }, function(){ $(this).css("background-color", "white"); }); }); </script></head><body><p>當鼠標懸停在這條段落上時,會變成黃色后景,鼠標移開后會恢復白色背景。</p></body></html>
上述代碼用到了jQuery的hover()方法,實現了鼠標懸停時改變背景顏色,移開后恢復原色的效果。通過引入jQuery庫和定義相關的JS代碼,實現了一個動態的效果。