[JavaScript]getElementByIdの使い方

2014年5月12日2021年10月15日

構文
var element = document.getElementById(id);
引数id : ID は大文字と小文字の区別がある文字列で、文書内で固有です。
返値
指定された ID に一致する DOM 要素オブジェクトを記述した Element オブジェクト、
または文書内に一致する要素がなければ null です。

Document の getElementById() メソッドは、 id プロパティが指定された文字列に一致する要素を表す Element オブジェクトを返します。

使用例

<html>
<head>
  <title>getElementByIdメソッドのサンプル
  </title>
</head>
<body>
  <p id="cft">テスト文字</p>
   <!-- onclickでボタンを押下し関数chgFunを呼び出す -->
  <button onclick="chgFun('blue');">青色</button>
  <button onclick="chgFun('yellow');">黄色</button>
  
<script>
  function chgFun(newColor) {
   //html要素id
    var em = document.getElementById('cft');
    //要素の色を変更
    em.style.color = newColor;
}
  </script>
</body>
</html>

JavaScript

Posted by arkgame

関連投稿: