javascript 一致するidがあるか判定する。

Question

やりたいこと
function idCheck()が読み込まれた時に
checkId　（今回は1と指定）と一致する
class　listの中のliタグのimgにid
があるかをチェックする。

一致するidのデータがあった場合アラートを出すという処理をおこないたい。

なので今回の場合は

    <li class="item" data-category="still"
       <a href="#">
           <img id= 1 src="画像URL";>
       </a>
    </li>

のidが1のデータがあるのでアラートが出るようにしたいです。

javascriptにて
指定されたidに一致データがあるかの判断をすることは可能でしょうか？
可能の場合どのように処理を行えばよいでしょうか？

現在のコード

<ul class="list">
    <li class="item" data-category="still"
       <a href="#">
           <img id= 1 src="画像URL";>
       </a>
    </li>
    <li class="item" data-category="still"
       <a href="#">
           <img id= 2 src="画像URL";>
       </a>
    </li>
    <li class="item" data-category="still"
       <a href="#">
           <img id= 3 src="画像URL";>
       </a>
    </li>
</ul>

    function idCheck() {
        var checkId= 1;
    }

Answer 1

!!document.getElementById(id);

Comments

[amaguri]

ありがとうございます！うまくいきました！

Answer 2

idCheck()

が外部から変数を持ち込まずにスタティックに処理をしているのが気になりますが
こんなチェック方法になるでしょう

var val=1;
if($('#'+val).length>0){
 すでにある
}

Comments

[amaguri]

回答ありがとうございました。
うまく動きました。
実際は外部からの変数を渡して動かすのですが
完結して描くために宣言させていただきました。

Answer 3

if (document.getElementById('1')) {
  alert('#1');
}

if (document.querySelector ('.list img#\1')) {
  alert('.list img#1');
}

idは同一文書上で一意でる必要がある為、基本的には前者で良いですが、同じ外部CSSを複数のWebページで参照しており、特定の構造のidのみにマッチさせる場合は後者になります。

idは数字から始まる名前にしない方が都合がよいと思います。
セレクタ指定時に面倒になるのと、数詞から始まる名前は何のナンバリングかが読み取れない点で論理構造を表す名前ではないためです。

Re: amaguri さん

Comments

[think49]

書いている間に解決したようですね…。

[amaguri]

ご丁寧に回答ありがとうございます！
とてもわかりやすく解説のおかげで理解することができました。