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

【JavaScript初心者向け】配列要素を追加・上書き・削除する方法

2022.08.22
3919
JavaScript

【JavaScript】キーボードで入力したキー値を取得する方法

2023.01.23
1492
JavaScript

JavaScriptで配列を複製。新しい配列を作成する方法【mapメソッドを使おう】

2023.01.09
884
JavaScript

JavaScriptでオブジェクトに指定したプロパティが存在しているかすぐ確認する方法

2022.12.19
3033