JavaScript 是一種用于網頁開發的動態語言，它的出現極大地擴展了前端開發的范圍，許多網站的動畫、交互等必不可少的部分都離不開它。在 JavaScript 中，有很多屬性可以讓我們更好地控制所編寫的代碼，接下來，我們就來逐一了解一下這些屬性。 1.文檔屬性 文檔屬性是指用于管理 HTML 和 XML 文件的屬性，通過這些屬性，我們可以獲取或者修改過去的文檔。其中，最常用的文檔屬性是 `document.body`，它指的是文檔的主體部分。

console.log(document.body);

這段代碼用來輸出文檔的主體元素，我們可以通過它來進一步地控制網頁的布局。 2.元素屬性 元素屬性是指 HTML 制定的標簽所擁有的屬性，這些屬性能夠影響元素的外觀和行為。其中，最常用的元素屬性是 CSS 的屬性，也就是我們通常所說的樣式。

let el = document.createElement('div');
el.style.width = '100px';
el.style.height = '100px';
el.style.backgroundColor = '#ccc';

上面的代碼是創建一個 div 元素，并為其設置了一些 CSS 樣式，這些樣式會影響到元素的顯示效果。 3.事件屬性 事件屬性是指用于在用戶與網頁交互時觸發的事件。通過事件屬性，我們可以監聽用戶的鼠標、鍵盤、觸屏等行為，并進行相應的操作。

let btn = document.querySelector('button');
btn.onclick = function() {
console.log('你點擊了按鈕');
}

上面的代碼是為一個按鈕添加了點擊事件，并在點擊時輸出了一段文本，這樣就可以在用戶點擊時做一些操作了。 4.資源屬性 資源屬性是指用于加載和顯示 HTML 資源的屬性，例如圖片、音頻、視頻等。通過資源屬性，我們可以獲取、預加載或者暫停某些資源，以便更好地控制網頁的加載速度和顯示效果。

let img = new Image();
img.src = 'https://placekitten.com/200/300';
img.onload = function() {
console.log('圖片加載完成');
}

上面的代碼是用于加載一張圖片，并在加載完成時輸出了一段文本，這樣就可以做到更好地控制圖片的加載和顯示。 5.表單屬性 表單屬性是指用于獲取用戶輸入數據的屬性，主要用于表單控件的操作。通過表單屬性，我們可以獲取表單中的數據、進行數據驗證、提交數據等。

let form = document.querySelector('form');
form.onsubmit = function(e) {
e.preventDefault();
console.log(form.username.value);
console.log(form.password.value);
}

上面的代碼是用于提交表單數據，并獲取表單中的用戶名和密碼，這樣就可以對用戶輸入的數據進行處理。 總之，JavaScript 中的屬性有很多種類，通過這些屬性，我們可以更好地控制網頁的外觀和行為，做到更好地用戶體驗。當然，除了上面所說的屬性之外，還有很多其他的屬性，如日期屬性、字符串屬性等，感興趣的讀者可以深入學習一下。