JavaScript是一種廣泛應用于Web編程的腳本語言，其強大的操作能力使得許多網站都采用了它來構建動態頁面。在JavaScript中，顯示時間是一項基本功能，它讓我們可以在網頁上方便地展示當前時間，也方便了用戶的使用。

我們先來看一個簡單的JavaScript代碼，這里使用了Date對象獲取當前時間，再使用JavaScript的Document對象輸出到頁面中：

var myDate = new Date();
document.write(myDate.toLocaleString());

上述代碼中，new Date()就是創建了一個Date對象，這個對象中包含了當前時間的各種屬性（年份、月份、日期、時分秒等）。我們調用myDate.toLocaleString()方法，就可以把這些屬性轉化為本地的字符串形式輸出到頁面上。

但是，我們會發現這種輸出的方式不是很美觀，我們通常希望形式化一些，讓它看起來更加好看。下面就給大家介紹幾種修改、美化輸出時間的方法。

方法一：使用字符串拼接

var myDate = new Date();
var year = myDate.getFullYear();
var month = myDate.getMonth()+1;
var date = myDate.getDate();
var hour = myDate.getHours();
var minute = myDate.getMinutes();
var second = myDate.getSeconds();
var timeString = year+"-"+month+"-"+date+" "+hour+":"+minute+":"+second;
document.write(timeString);

上述代碼中，我們把日期的各個屬性分別提取出來，用字符串拼接的方式輸出。這樣輸出的時間格式就更加清晰明了了。

方法二：使用JavaScript函數庫

除了手寫代碼，我們也可以使用現成的JavaScript函數庫來方便地輸出時間。其中比較流行的是moment.js庫，這個庫可以在網上免費下載，并且使用極其簡單。

var curTime = moment().format('YYYY-MM-DD hh:mm:ss');
document.write(curTime);

上述代碼中，我們調用moment()函數獲得當前時間，再使用.format()方法把它轉化成指定格式字符串，方便輸出。

方法三：使用CSS樣式調整

在前面的方法中，我們是通過JavaScript來調整時間輸出的格式。事實上，我們也可以在CSS中進行樣式的調整，讓時間的展示效果變得更好。

首先，我們需要在HTML中為時間輸出部分設置一個樣式：

<span id="clock"></span>

#clock{
font-size: 30px;
font-weight: bold;
color: #f00;
text-shadow: 1px 2px 3px #ccc;
}

上述代碼中，我們為#clock樣式設置了一些CSS特效，包括字體大小、顏色、加粗、文本陰影等，來讓時間更加醒目。

接著，我們在JavaScript中定義出一個函數，用來輸出時間到頁面上：

function showTime(){
var myDate = new Date();
var timeString = myDate.toLocaleString();
document.getElementById("clock").innerHTML = timeString;
}
setInterval("showTime()",1000);

上述代碼中，我們定義了一個showTime函數，每1秒鐘調用一次，獲得當前時間并轉換為本地字符串，再把其輸出到HTML頁面上。我們給時間輸出部分的容器span設置一個id，然后用getElementById來獲取這個容器，把時間輸出到這個容器中。

通過上面的方法，我們就可以輕松地實現在頁面上顯示當前時間的功能了。不過需要注意的是，不同瀏覽器之間時間的展示效果可能是不同的，也需要我們進行相應的調整。