現今，網頁前端開發技術愈發發展，其中Javascript已是必不可少的一門前端開發技術。Javascript可以做到許多有趣的事情，如實現動態效果和交互式操作，也可以做到一些比較基礎的功能，如驗證表單，實現計算器等。下面，我們來看看一些Javascript所做的一些有趣的網頁實例。
第一個例子：鼠標移動小球
<!DOCTYPE html>
<html>
<head>
<title>小球跟隨鼠標移動的例子</title>
</head>
<body>
<div id="ball"></div>
<script type="text/javascript">
window.onload = function(){
var oBox = document.getElementById("ball");
document.onmousemove = function(event){
var x = event.clientX,
y = event.clientY;
oBox.style.left = x + "px";
oBox.style.top = y + "px";
}
}
</script>
</body>
</html>這個例子做的事情是在頁面上創建了一個div元素，然后通過Javascript實現當鼠標在頁面上移動時，小球跟隨鼠標移動。這個例子使用到了鼠標事件(mousemove)、變量、操作DOM元素等知識。
第二個例子：倒計時
<!DOCTYPE html>
<html>
<head>
<title>倒計時</title>
</head>
<body>
<div id="countdown"></div>
<script type="text/javascript">
window.onload = function(){
var oBox = document.getElementById("countdown");
var targetTime = new Date("2021-12-01"),
targetTimestamp = targetTime.getTime();
setInterval(function(){
var currentTime = new Date(),
currentTimestamp = currentTime.getTime();
var remain = (targetTimestamp - currentTimestamp) / 1000,
day = Math.floor(remain / 86400),
hour = Math.floor((remain % 86400) / 3600),
minute = Math.floor((remain % 3600) / 60),
second = Math.floor(remain % 60);
oBox.innerHTML = "距離2021年12月1日還有" + day + "天" + hour + "小時" + minute + "分" + second + "秒";
}, 1000);
}
</script>
</body>
</html>這個例子則是用Javascript實現了一個倒計時功能，當訪問這個頁面時，會在頁面上顯示還有多少天、小時、分、秒將到達目標時間。該例子使用到了時間對象、定時器等知識。
通過上面的兩個例子，我們可以看出Javascript的強大之處。Javascript可以用來展示創意的和交互性的網頁，也可以用來實現一些基本的功能。Javascript的學習是成套的，不斷學習各種知識點，你也可以成為一個Javascript大神。