JavaScriptでの属性の取得や追加、削除の方法【現役エンジニアが解説】

PROGRAM

今回は、JavaScriptでの属性の取得や追加、削除の方法について、それぞれに分け、簡単に解説していきます。

属性の取得

属性の値を取得するにはElementのgetAttributeメソッドを使います。

ElementのgetAttributeメソッドでは、属性名を引数に指定するとその属性の値を取得できます。

element.getAttribute("username");

上記のコードでは、”username”という名前の属性の値をElementのgetAttributeメソッドを使って取得しています。

属性の追加

属性を新たに追加するにはElementのsetAttributeメソッドを使用します。

ElementのsetAttributeメソッドでは、第一引数に属性名、第二引数に値を指定すると属性を追加できます。

element.setAttribute("username","hoge");

上記のコードでは、ElementのsetAttributeメソッドで、”username”という名前の属性を、”hoge”という値で設定しています。

属性の削除

属性を要素から削除するにはElementのremoveAttributeメソッドを使います。

ElementのremoveAttributeメソッドでは、引数に指定した名前を持つ属性を要素から削除することができます。

element.removeAttribute("username");

上記のコードは、ElementのremoveAttributeメソッドを使って、”username”という名前の属性を要素から削除するサンプルコードです。