JavaScriptにおいて、forとifを組み合わせたコードが上手くいかない！！

Question

はじめまして！

現在、for構文を利用したコードにif構文を入れこみたいと考えており、以下のようにif構文を追加したのですが、上手く機能しません。

このような場合どのような処置をとればよいでしょうか?

是非ともご教授のほどよろしくお願い申し上げます。

downloadUrl("http://略", function(data) {
            var xml = data.responseXML;
            var markers = xml.documentElement.getElementsByTagName("marker");
            for (var i = 0; i < markers.length; i++) {
            // if (markerType == markers[i].getAttribute("type")) {
            var name = markers[i].getAttribute("name");
            var address = markers[i].getAttribute("address");
            var type = markers[i].getAttribute("type");
            var point = new google.maps.LatLng(
                                               parseFloat(markers[i].getAttribute("lat")),
                                               parseFloat(markers[i].getAttribute("lng")));
            var html = "<b>" + name + "</b> <br/>" + address;
            var icon = customIcons[type] || {};
            var marker = new google.maps.Marker({
                                                map: map,
                                                position: point,
                                                icon: icon.icon
                                                });
            
            bindInfoWindow(marker, map, infoWindow, html);
            // }
            }
            });
}

Answer 1

なんとなくgoogleMapのAPIからXMLを取得して表示したいのかな？と思いました。

1. 問題となっているif文がない状態では意図した通り動作していますでしょうか？
2. 1がYESの場合完全にif文に問題があると考えられます。Noの場合はそれ以外の部分が問題なので個別の処理ごとにチェックしてどこに問題があるか探す必要があります。

LLmanさんがおっしゃられている通り変数markerTypeが示されているコード内では定義されていないようです。
Chromeで見ているのであればメニューバーの表示 > 開発/管理 > javascriptコンソールを選択してみてください。表示されたコンソールに
Uncaught ReferenceError: markerType is not defined
と表示されていないでしょうか？

このエラーが表示されている場合は 変数markerType が定義されていないのが原因でエラーを起こしてしまっているのが原因になります。**markers[i].getAttribute("type")**で取得できる属性で判定したい属性の文字列を前もってこの変数に定義してあげれば問題なくなるかと思います。

// 前略
  var markerType = 'マーカータグのtype属性で取得したい値を指定';
  for (var i = 0, l = markers.length; i < l; i+=1) {
    if (markerType == markers[i].getAttribute("type")) {
      // 略
    }
  }

既に別のところで変数markerTypeを定義しているのであれば、
**markers[i].getAttribute("type")**で取得できている値が期待できているものでない可能性が高いです。

// 前略
  for (var i = 0, l = markers.length; i < l; i+=1) {
    // コンソールなどで何が取得できているか表示して確かめてみてはいかがでしょう？
    console.log( markers[i].getAttribute("type") );
    if (markerType == markers[i].getAttribute("type")) {
      // 略
    }
  }

また、先ほどの開発者ツールのNetworkタブを開けば、name下のリスト内に取得されているxmlがあると思いますので、それをクリックしてみてください。取得できているXMLが右のエリアに表示されると思います。
<marker>タグを探して、そこに期待されるtype="なんとか"が存在するのか確かめてみてはいかがでしょう？もしかすると判別したかったのはtype属性ではなかったという可能性もあるかもしれませんので。

Comments

[Shinog]

親切丁寧なご回答ありがとうございました！

KiKiKi_KiKiさんのおっしゃる通り、
変数markerType が定義されていないのが原因でエラーを起こしてしまっているのが原因でした。
本当に初歩的なミスですが、「var markerType」 = のあとに「' '」を付けていなかったことが問題だったようです(> <)

本当にありがとうございます！！

Answer 2

// if (markerType == markers[i].getAttribute("type")) {
 // }

コメントアウトされた上の行を足しても、
意図通り動作しないということですか？

if文の中で比較している「markerType」の宣言文が
質問文の範囲にはありませんが、値は何が入っているのでしょうか？

もし、コメント部分のifはサンプルのつもりで書いていて、
実際にエラーが起きたときと違う内容になっていたとしたら、
その実際に使ったほうのif文も書いてください。

そもそもif文で何をしたいのかの説明も欲しいです。