Written by Kasumi

JavaScriptでHTMLタグに属性を追加する方法

JavaScriptでHTMLタグに属性を追加したい。

本記事ではこのような悩みを解決。

実装方法について解説します。

setAttributeメソッドで属性を追加

// HTMLのbuttonタグを指定
const btn = document.querySelector('button');
// buttonタグにtype属性を追加
btn.setAttribute("type","submit");

JavaScriptでHTMLタグに属性を追加するコード例です。

buttonタグにtype属性を付与。

属性値にsubmitを追加してます。

属性の追加にはsetAttributeメソッドを使います。

setAttributeメソッドの使い方は以下の通りです。

属性を追加するHTML要素.setAttribute(“属性”,”属性値”);

属性を追加する要素にチェーンメソッドでsetAttributeを連結。

setAttributeの第一引数に属性名

第二引数に属性の値を追加します。

以上で属性の追加が完了です。

まとめ

JavaScriptでHTMLタグに属性を追加する方法について紹介しました。

以上で解説を終わります。

目次

関連記事

JavaScript

Failed to execute ‘insertBefore’ on ‘Node’ The node before which the new node is to be inserted is not a child of this node.の原因・対処方法

2022.12.03
3491
JavaScript

IEブラウザか、その他以外のブラウザかを判定し、条件分岐・判別する方法【Javascript】

更新日:2022.09.09
1078
JavaScript

JavaScriptでHTML要素にCSSを追加する方法

2023.03.30
1518
JavaScript

【JavaScript】マウスホイールした時のスクロール量を表示する方法

2023.02.07
2220