Skip to main content
se añadieron 89 caracteres en el cuerpo
Origen Enlace
Alvaro Montoro
  • 49.8k
  • 28
  • 109
  • 190

Si lo que quieres es quedarte sólo con los span que están dentro de otro span en el div con clase .row, te recomendaría que usases un selector diferente de getElementsByTagName. Por ejemplo, sería más conveniente usar querySelectorAllquerySelectorAll.

A esa función le pasas un selector como los de CSS y te devolverá todos los elementos que cumplen esa condición. Así por ejemplo, con el selector .row > span > span lo que vas a obtener son todos los elementos span que son hijos directos de otro span y que estén dentro de .row. Aquí lo puedes ver funcionando:

function myFunction6() {
  var foo = document.querySelectorAll('.row > span > span');
  for (var i = 0; i < foo.length; i++) {
    console.log(foo[i].tagName + " " + foo[i].textContent);
  }
}

myFunction6()
<div class="row">
  <span class="red">66 
    <span>22 </span>
  </span>
  <span class="green">24
    <span class="blue" style="color: #000;">82 </span>
  </span>
  <span class="green">10 
    <span class="blue" style="color: #000;">1 </span>
  </span>
  <span class="red">69 
    <span>80 </span>
  </span>
  <span class="red">12 
    <span class="green" style="color: #000;">11 </span>
  </span>
</div>

Si lo que quieres es quedarte sólo con los span que están dentro de otro span en el div con clase .row, te recomendaría que usases un selector diferente de getElementsByTagName. Por ejemplo, sería más conveniente usar querySelectorAll.

A esa función le pasas un selector como los de CSS y te devolverá todos los elementos que cumplen esa condición. Así por ejemplo, con el selector .row > span > span lo que vas a obtener son todos los elementos span que son hijos directos de otro span y que estén dentro de .row. Aquí lo puedes ver funcionando:

function myFunction6() {
  var foo = document.querySelectorAll('.row > span > span');
  for (var i = 0; i < foo.length; i++) {
    console.log(foo[i].tagName + " " + foo[i].textContent);
  }
}

myFunction6()
<div class="row">
  <span class="red">66 
    <span>22 </span>
  </span>
  <span class="green">24
    <span class="blue" style="color: #000;">82 </span>
  </span>
  <span class="green">10 
    <span class="blue" style="color: #000;">1 </span>
  </span>
  <span class="red">69 
    <span>80 </span>
  </span>
  <span class="red">12 
    <span class="green" style="color: #000;">11 </span>
  </span>
</div>

Si lo que quieres es quedarte sólo con los span que están dentro de otro span en el div con clase .row, te recomendaría que usases un selector diferente de getElementsByTagName. Por ejemplo, sería más conveniente usar querySelectorAll.

A esa función le pasas un selector como los de CSS y te devolverá todos los elementos que cumplen esa condición. Así por ejemplo, con el selector .row > span > span lo que vas a obtener son todos los elementos span que son hijos directos de otro span y que estén dentro de .row. Aquí lo puedes ver funcionando:

function myFunction6() {
  var foo = document.querySelectorAll('.row > span > span');
  for (var i = 0; i < foo.length; i++) {
    console.log(foo[i].tagName + " " + foo[i].textContent);
  }
}

myFunction6()
<div class="row">
  <span class="red">66 
    <span>22 </span>
  </span>
  <span class="green">24
    <span class="blue" style="color: #000;">82 </span>
  </span>
  <span class="green">10 
    <span class="blue" style="color: #000;">1 </span>
  </span>
  <span class="red">69 
    <span>80 </span>
  </span>
  <span class="red">12 
    <span class="green" style="color: #000;">11 </span>
  </span>
</div>

Origen Enlace
Alvaro Montoro
  • 49.8k
  • 28
  • 109
  • 190

Si lo que quieres es quedarte sólo con los span que están dentro de otro span en el div con clase .row, te recomendaría que usases un selector diferente de getElementsByTagName. Por ejemplo, sería más conveniente usar querySelectorAll.

A esa función le pasas un selector como los de CSS y te devolverá todos los elementos que cumplen esa condición. Así por ejemplo, con el selector .row > span > span lo que vas a obtener son todos los elementos span que son hijos directos de otro span y que estén dentro de .row. Aquí lo puedes ver funcionando:

function myFunction6() {
  var foo = document.querySelectorAll('.row > span > span');
  for (var i = 0; i < foo.length; i++) {
    console.log(foo[i].tagName + " " + foo[i].textContent);
  }
}

myFunction6()
<div class="row">
  <span class="red">66 
    <span>22 </span>
  </span>
  <span class="green">24
    <span class="blue" style="color: #000;">82 </span>
  </span>
  <span class="green">10 
    <span class="blue" style="color: #000;">1 </span>
  </span>
  <span class="red">69 
    <span>80 </span>
  </span>
  <span class="red">12 
    <span class="green" style="color: #000;">11 </span>
  </span>
</div>