HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTML DOMのspecifiedプロパティとは？属性が指定されているか確認する方法

HTML DOMのspecifiedプロパティは、ある属性が明示的に指定されているかどうかを判定するために使用されます。属性が指定されていればtrueを、指定されていなければfalseを返します。また、属性ノードを作成したものの、まだ要素に追加していない場合にもtrueを返すという特徴があります。

構文

specifiedプロパティの基本的な構文は以下のとおりです。

attribute.specified

使用例

ここでは、画像要素にalt属性が指定されているかどうかをボタンのクリックで確認するサンプルを紹介します。

<!DOCTYPE html>
<html>
<body>
<p>下の画像にはalt属性が指定されています。ボタンをクリックして確認してみましょう。</p>
<img id="IMG1" src="https://www.tutorialspoint.com/swing/images/swing-mini-logo.jpg"
alt="Learn Swing">
<p> 下のボタンをクリックすると、上の画像にalt属性が指定されているかどうかをチェックできます </p>
<button onclick="checkAlt()">CHECK</button>
<p id="Sample"></p>
<script>
    function checkAlt() {
        var img = document.getElementById("IMG1");
        var s = img.getAttributeNode("alt").specified;
        if(s == true)
            document.getElementById("Sample").innerHTML = "このimg要素にはalt属性が指定されています";
        else
            document.getElementById("Sample").innerHTML = "このimg要素にはalt属性が指定されていません";
    }
</script>
</body>
</html>

実行結果

このコードを実行すると、まず次のような画面が表示されます。

HTML DOMのspecifiedプロパティとは？属性が指定されているか確認する方法

CHECKボタンをクリックすると、JavaScriptのgetAttributeNode()メソッドで取得したalt属性ノードのspecifiedプロパティが評価され、次のように結果が表示されます。

HTML DOMのspecifiedプロパティとは？属性が指定されているか確認する方法

ポイント解説

  • getAttributeNode()メソッドは、指定した属性名に対応するAttrノードを返します。
  • そのAttrノードに対して.specifiedを参照することで、HTML上で明示的に記述された属性かどうかを判別できます。
  • なお、specifiedプロパティは現在では非推奨（Deprecated）とされており、モダンな開発ではhasAttribute()メソッドを使うことが推奨されています。
  1. HTML DOM Ol reversedプロパティとは？リストの降順・昇順を切り替える方法を解説

    HTML DOMのOl reversedプロパティは、順序付きリスト（<ol>要素）の番号を降順にするか、昇順（デフォルト）にするかを設定・取得するためのプロパティです。JavaScriptから動的にリストの番号付けの方向を変更したい場合に活用できます。構文ブール値（true / false）を取得する場合olObject.reversedreversedプロパティにブール値を設定する場合olObject.reversed = booleanValueここで指定できる「booleanValue」の値と意味は以下の通りです。booleanValue説明trueリストの番号が降順で表示

  2. HTML DOM offsetWidthプロパティの使い方をわかりやすく解説

    HTML DOM offsetWidthプロパティとは HTML DOMのoffsetWidthプロパティは、要素の実際の表示幅に対応する数値(ピクセル単位の整数)を返します。この幅にはパディング・ボーダー(境界線)・スクロールバーが含まれますが、マージンは含まれません。なお、offsetWidthは読み取り専用のプロパティのため、値を直接代入することはできません。 構文 HTMLElement.offsetWidth 要素が非表示(display: none など)の状態にある場合は、0 が返されます。 関連プロパティとの違い offsetWidth: パディング+ボーダー+スクロールバー