如何使用 JavaScript 設置屬性的值

要設置 HTML 元素的屬性值，可以使用 setAttribute() 方法。此方法將指定的屬性添加到 HTML 並賦予它指定的值。

如果屬性已經存在，它只會改變值。

假設您有以下 <div> 元素：

<div class="pizza">Hot, spicy, pizza 🍕</div>

以下示例添加 title 屬性並設置其值：

const pizza = document.querySelector('.pizza');

pizza.setAttribute('title', 'Italian Pizza');

console.log(pizza.getAttribute('title')); // Italian Pizza

您也可以使用 setAttribute() 改變元素內聯樣式的方法：

pizza.setAttribute('style', 'background-color: pink;');

setAttribute() 方法也可用於設置 HTML5 data-* 的值 屬性：

pizza.setAttribute('data-type', 'italian');

此方法適用於所有現代瀏覽器，以及 IE9 及更高版本。