getElementsByTagName.textContent возвращает неопределенное значение

#javascript #xml

Вопрос:

У меня есть XML-файл

 <lle:Event>
      <lle:eventid>ID01</lle:eventid>
      <lle:collab>
        <lle:name>Jane Doe</lle:name>
        <lle:support>Carer</lle:support>
        <lle:supportTime>8am - 8pm</lle:supportTime>
        <lle:location>
          <lle:lat>1.3117216424564617</lle:lat>
          <lle:lng>103.8149642944336</lle:lng>
        </lle:location>
      </lle:collab>
    </lle:Event>
    <lle:Event>
      <lle:eventid>ID02</lle:eventid>
      <lle:collab>
        <lle:name>Peter Smith</lle:name>
        <lle:support>Carer</lle:support>
        <lle:supportTime>8am - 8pm</lle:supportTime>
        <lle:location>
          <lle:lat>1.3772782313341114</lle:lat>
          <lle:lng>103.89873504638672</lle:lng>
        </lle:location>
      </lle:collab>
    </lle:Event>
    <lle:Event>
      ...
    </lle:Event>
        <lle:Event>
      <lle:eventid>ID08</lle:eventid>
      <lle:collab>
        <lle:name>Ang</lle:name>
        <lle:support>Doctor</lle:support>
        <lle:supportTime>8am - 8pm</lle:supportTime>
        <lle:img>avatar.png</lle:img>
        <lle:location>
          <lle:lat>1.3577459437939223</lle:lat>
          <lle:lng>103.84522878271483</lle:lng>
        </lle:location>
      </lle:collab>
    </lle:Event>

 

В некоторых событиях lle:есть элемент lle:img, в то время как в некоторых его нет.

Я пытаюсь дифференцировать их с помощью javascript, чтобы использовать пользовательский маркер изображения на карте Google для тех, у кого есть элемент lle:img.

 var events = xml.documentElement.getElementsByTagName("lle:Event");
                         console.log(events);
                         for (var i = 0; i < events.length; i  ) {
                             
                             var name = xml.documentElement.getElementsByTagName("lle:name")[i].textContent;
                             var support = xml.documentElement.getElementsByTagName("lle:support")[i].textContent;
                             var supportTime = xml.documentElement.getElementsByTagName("lle:supportTime")[i].textContent;
                             var lat = xml.documentElement.getElementsByTagName("lle:lat")[i].textContent;
                             var lng = xml.documentElement.getElementsByTagName("lle:lng")[i].textContent;

                             latLng = new google.maps.LatLng(lat, lng);
                             
                           
                             if (events[i].getElementsByTagName("lle:img").length > 0 ) {
                                 var imgPath = xml.documentElement.getElementsByTagName("lle:img")[i].textContent;
                                 console.log(imgPath);
                                 var marker = new google.maps.Marker({
                                     position: latLng,
                                     map,
                                     title: "Name: "   name   "nSupport: "   support   "nSupport Time: "   supportTime,
                                     
                                 });
                             } else if (!events[i].getElementsByTagName("lle:img").length > 0) {
                                
                                 var marker = new google.maps.Marker({
                                     position: latLng,
                                     map,
                                     title: "Name: "   name   "nSupport: "   support   "nSupport Time: "   supportTime,
                                 });
                             }
 

В приведенном выше примере я проверяю, существует ли lle:img с помощью

 events[i].getElementsByTagName("lle:img").length > 0 
 

Однако, когда я пытаюсь получить imgPath с помощью getElementsByTagName(«lle:img»)[i].textContent с

 var imgPath = xml.documentElement.getElementsByTagName("lle:img")[i].textContent;
 

консоль.результаты журнала всегда отображаются неопределенными.

Я очень уверен, что элемент lle:img есть, но каким-то образом он все еще возвращается неопределенным. Есть ли что-нибудь не так, что я здесь делаю?

Комментарии:

1. может быть, вы могли бы проверить, соответствует ли возвращаемое значение getElementsByTagName тому, каким оно должно быть

2. @OtherMe Я проверил, что все getElementsByTagName до того, как if else вернет правильное значение. Только тот, который пытается получить «lle:img», дает мне неопределенное.

3. почему вы переходите от поиска в текущем event к поиску по всему документу? Если у каждого event нет ровно 1 «lle:img», ваш индекс [i] будет неверным

4. кроме того, в вашем другом состоянии это вызывает беспокойство. Вероятно, это работает по чистой случайности, но вы уже проверили свое if состояние, так что нет необходимости проверять еще раз. else

Ответ №1:

Это то, что вы регистрируете в своем if

events[i].getElementsByTagName("lle:img").length

и это то, что вы используете для установки imgPath

xml.documentElement.getElementsByTagName("lle:img")[i].textContent

видите разницу? В частности, i это указатель на событие. Нет смысла использовать его для индексации элементов «lle:img». Предположительно, у вас меньше элементов «lle:img», чем событий, поэтому ваш индекс находится вне зоны действия.

Ваше else состояние тоже глючит. Вероятно, это сработает, потому !...length что будет true , когда длина равна 0, а истина > 0, но это просто удача. Тебе это совсем не нужно.

попробуйте это

 if (events[i].getElementsByTagName("lle:img").length > 0 ) {
    var imgPath = events[i].getElementsByTagName("lle:img")[0].textContent;
    console.log(imgPath);
    ...

} else {
    ...
}                  
 

а еще лучше, сократите количество раз, когда вы его анализируете, и сохраните найденные элементы:

 var images = events[i].getElementsByTagName("lle:img")
if (images.length > 0) {
    var imgPath = images[0].textContent
    ...
}
else {
    ...
}
 

Комментарии:

1. Вот что это было! Индекс был вне диапазона, поэтому возвращаемое значение не определено. Это объяснение действительно очень помогло! Сейчас это работает. Большое спасибо!