Elementとは
- Element とは次の語句からなるHTMLの要素をjavascriptで表現したものです。
- element
- 読み: エレメント
意味: 要素
removeAttributeとは
- removeAttribute とは次の語句からなるjavascriptのメソッドです。
- remove
- 読み: リムーブ
意味: 削除 - attribute
- 読み: アトリビュート
意味: 属性
Element.removeAttributeの概要
このメソッドは、要素から指定した属性を削除します。 また、要素に指定した属性がない場合には、undefined(参照できない)が返ります。
サンプルコードと実行結果
このサンプルではremoveAttributeメソッドを使って、要素から class 属性を削除しています。 CSSでclassにスタイルを設定しているので、class属性が削除されれば、そのスタイルは無効となります。
サンプルコード: CSS
<style>
.newClass{
text-decoration: underline wavy green;
}
</style>
- 02: newClassというclassにスタイル付け
- 03: text-decorationプロパティで緑色の波下線を設定
サンプルコード: HTML
<body>
<p>
<output id="idAnswer" class="newClass">innerHTML</output>
</p>
<p>
<input type="button" value="ボタン" onclick="evtName()">
</p>
</body>
- 03: output要素 id="idAnswer"(この要素からclassが削除されることになる)
- 06: input要素 button型(この要素をクリックするとevtName()関数を呼び出す)
サンプルコード: script
<script>
let elmAnswer = document.getElementById("idAnswer");
function evtName(){
elmAnswer.removeAttribute("class");
}
</script>
- 02: elmAnswerという要素参照の変数を宣言 (idAnswer)
- 03: 関数を定義 (evtName()関数)
- 04: ここでelmAnswerからclass属性を削除
答え: id="idAnswer"
実行:
removeAttributeを使用する上での要点
- 引数は文字型
- 構文: Element.removeAttribute(attrName)
- 構文: Element.removeAttribute(属性名)