NEW ARTICLE
EXCEL セルの塗りつぶしをデフォルトに戻すショートカットキー
  • javascript document.getElementByIdの省略して記述する

javascript document.getElementByIdの省略して記述する

javascript document.getElementByIdの省略して記述する

javascriptで、document.getElementByIdの省略して記述する方法を掲載してます。

目次

環境

  • OS windows10 pro 64bit
  • Apache 2.4.43
  • ブラウザ chrome 100.0.4896.60
Javascript サンプル集はこちら

document.getElementByIdの省略

idが指定されていれば、document.getElementByIdは省略して記述することが可能です。

<!-- html -->
<p id="hoge"></p>

<!-- js -->
<script>

hoge.textContent = "test";

</script>

「’use strict’;」を使用しても、問題ないです。

use strictについて
<!-- html -->
<p id="hoge"></p>

<!-- js -->
<script>

'use strict';
hoge.textContent = "test";

</script>

id属性があるhtmlタグは、windowの同名のプロパティとして利用することができます。

注意

ただし、idに数値や予約語、演算子は、利用できないので注意が必要です。

<p id="123"></p>
123.textContent = "test"; // エラー

<p id="var"></p>
var.textContent = "test"; // エラー

<p id="hoge-hoge"></p>
hoge-hoge.textContent = "test"; // エラー

また、既に利用されている場合も正常に動作しないので注意が必要です。

<p id="hoge"></p>

let hoge = "test"

hoge.textContent = "test";