「JavaScript」getAttributeでhtmlタグの属性値を取得

2022年2月16日

書式
var 変数名 = document.getElementById(セレクタID名).getAttribute(タグ名);
getAttributeを使用してHTMLタグの属性値を取得します。
使用例

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <title>htmlタグの属性値を取得するサンプル</title>
  <script >function funA(){
  var cft = document.getElementById("username").getAttribute("maxlength");
  alert("maxlengthプロパティの値:"+cft);
  var cftB = document.getElementById("username").getAttribute("style");
  alert("styleプロパティの値:"+cftB);
}</script>
</head>
<body>
  <input type="text" id="username" value="山田　太朗" maxlength="10" style="color:blue;"/>
  <input type="button" value="検証" onclick="funA();" />
</body>
</html>

結果
「検証」ボタンを押すと、alertに以下のメッセージが表示されます。
maxlengthプロパティの値:10
styleプロパティの値:color:blue;

JavaScript

Posted by arkgame

関連記事: