HTML DOM setAttribute（）メソッド
❮要素オブジェクト例
「democlass」の値を持つclass属性を<h1>要素に追加します。
document.getElementsByTagName("H1")[0].setAttribute("class", "democlass");
属性を設定する前に：
Hello World
属性を設定した後：
Hello World
以下の「自分で試してみてください」の例をもっと見てください。
定義と使用法
setAttribute（）メソッドは、指定された属性を要素に追加し、指定された値を与えます。
指定された属性がすでに存在する場合は、値のみが設定/変更されます。
注：このメソッドを使用して要素に値を持つスタイル属性を追加することは可能ですが、 インラインスタイルの代わりにStyleオブジェクトのプロパティを使用することをお勧めします。これにより、で指定される可能性のある他のCSSプロパティが上書きされないためです。スタイル属性：
悪い：
element.setAttribute("style", "background-color: red;");
良い：
element.style.backgroundColor = "red";
ヒント：要素から属性を削除するには、 removeAttribute（）メソッドを使用します。
ヒント：setAttributeNode（）メソッドも参照してください。
ブラウザのサポート
表の数字は、このメソッドを完全にサポートする最初のブラウザバージョンを示しています。
| Method | |||||
|---|---|---|---|---|---|
| setAttribute() | Yes | 8.0 | Yes | Yes | Yes |
構文
element.setAttribute(attributename, attributevalue)
パラメータ値
| Parameter | Type | Description |
|---|---|---|
| attributename | String | Required. The name of the attribute you want to add |
| attributevalue | String | Required. The value of the attribute you want to add |
技術的な詳細
| 戻り値： | 戻り値なし |
|---|---|
| DOMバージョン | コアレベル1要素オブジェクト |
その他の例
例
入力フィールドを入力ボタンに変更します。
document.getElementsByTagName("INPUT")[0].setAttribute("type", "button");
属性を設定する前に：
属性を設定した後：
例
「www.w3schools.com」の値を持つhref属性を<a>要素に追加します。
document.getElementById("myAnchor").setAttribute("href", "https://www.w3schools.com");
属性を設定する前に：
Go to w3schools.com
属性を設定した後：
例
<a>要素にターゲット属性があるかどうかを調べます。その場合は、ターゲット属性の値を「_self」に変更します。
// Get the <a> element with id="myAnchor"
var x = document.getElementById("myAnchor");
// If the <a> element has a target attribute, set the value to "_self"
if (x.hasAttribute("target")) {
x.setAttribute("target", "_self");
}
関連ページ
HTMLチュートリアル：HTML属性
HTML DOMリファレンス：getAttribute（）メソッド
HTML DOMリファレンス：hasAttribute（）メソッド
HTML DOMリファレンス：removeAttribute（）メソッド
❮要素オブジェクト