JavaScript是一種常用的前端編程語言，在網頁制作中發揮著至關重要的作用。在本篇文章中，我們將會介紹JavaScript的五個特征，以及如何利用這些特征來制作出漂亮的網頁效果。

第一個特征是變量。通過定義一個變量，我們可以存儲和傳遞數據，例如文字、數字、日期等等。下面是一個關于商品價格的例子：

var price = 12.34;
document.write("這件商品的價格是：" + price + "元");

在代碼中，我們首先定義了一個變量“price”，然后使用了“document.write”函數來實現向網頁中插入文字的效果。利用“+”號連接字符串和變量，我們成功地輸出了商品的價格。

第二個特征是函數。通過定義一個函數，我們可以封裝一個任務，并隨時調用它。例如下面的代碼將執行一個彈出“歡迎光臨”的函數：

function welcome() {
alert("歡迎光臨");
}
welcome();

在代碼中，我們首先定義了一個名為“welcome”的函數，它不接受任何參數。然后，我們通過“alert”函數來實現彈出提示框的效果。最后，我們使用了“welcome()”函數調用的方式來執行這段代碼。

第三個特征是對象。通過定義一個對象，我們可以將變量和函數組合在一起，形成一個封裝的數據結構。例如下面的代碼定義了一個包含姓名、年齡、性別、自我介紹的對象：

var person = {
name: "張三",
age: 20,
gender: "男",
introduce: function() {
alert("我叫" + this.name + "，今年" + this.age + "歲，是一名" + this.gender + "生。");
}
}
person.introduce();

在代碼中，我們首先使用“var”關鍵字定義了一個名為“person”的對象。然后，我們在花括號中定義了該對象包含的四個屬性，分別是姓名、年齡、性別和自我介紹。接著，我們定義了一個名為“introduce”的函數，它使用了“alert”函數來實現自我介紹的效果。最后，我們使用了“person.introduce()”函數調用的方式來執行這段代碼。

第四個特征是事件。通過定義一個事件，我們可以實現用戶與網頁的交互。例如下面的代碼實現了一個點擊按鈕后彈出提示框的效果：

<button onclick="alert('您點擊了按鈕')">點擊我</button>

在代碼中，我們使用了“onclick”事件來監聽按鈕的點擊。當用戶點擊該按鈕時，即會執行彈出提示框的效果。

第五個特征是DOM。通過使用DOM（文檔對象模型），我們可以修改網頁中的任何元素，包括文本、圖片、樣式等等。例如下面的代碼將修改一個段落的樣式：

var p = document.getElementById("paragraph");
p.style.color = "red";
p.style.fontSize = "16px";

在代碼中，我們首先使用“document.getElementById”函數來獲取一個名為“paragraph”的段落元素。然后，通過“p.style.”方式來修改該元素的兩個樣式屬性，分別是顏色和字體大小。

綜上所述，JavaScript的五個特征分別是變量、函數、對象、事件和DOM。通過靈活應用這些特征，我們可以制作出豐富多彩、互動性高的網頁效果。