Foros del Web - Ver Mensaje Individual

Pantaláimon · #5 (**permalink**) 01/12/2013, 05:54

Cita:

Iniciado por marlanga

getElement y getElements recorre el childnodes por tí. ¿Para qué recorrerlo tú manualmente si ya lo hacen por tí? Puedes programar una versión recortada que sólo recorra el childnodes del elemento que le pases, sin recorrer los childnodes de cada uno de sus hijos, pero la ganancia que vas a tener es insignificante.

Por otro lado, ¿te parece más eficiente que el navegador cuando carga la página haga cientos de colecciones que almacenen los tags que están contenidos en otros tags, para que luego muy probablemente el programador no use nunca?

Depende, si que tenía entendido que se hacían colecciones de tags para tener un acceso más rápido. Pero puede haber casos en que con getElementsByTagName obtengas toda una lista de nodos y luego dentro de esta tengas que encontrar el que es el hijo directo del nodo.

De todos modos, veo que una mejor solución seria cambiar el id de section y ponerlo en el elemento p.

HTML:

Código HTML:

Ver original<!DOCTYPE html>
<html lang='es'>
  <head>
    <meta charset='UTF-8' />
    <script type='text/javascript' src='js/insert_text.js'></script>
    <title>Insertando texto</title>
  </head>
  <body>
    <header>
      <h1>Insertando texto</h1>
    </header>
    <section>
      <h2>Opción 1</h2>
      <label>Escribir texto: <input type='text' /></label>
      <button id='button_1'>insertar</button>
      <p id='option_1'><span>blablabla</span><span>bleble</span></p>
    </section>
    <section>
      <h2>Opción 2</h2>
      <label>Escribir texto: <input type='text' /></label>
      <button id='button_2'>insertar</button>
      <p id='option_2'><span>blobloblo</span><span>blublu</span></p>
    </section>
  </body>
</html>

Javascript:

Código Javascript:

Ver originalfunction insert()
{
    // crear elemento span con texto "blibli"
    var text = document.createElement("span");
    var content = document.createTextNode("blibli");
    text.appendChild(content);
 
    //buscar nodo donde insertar
    var node = document.getElementById( 'option_' + this.id.substr( 7 ) );
 
    // insertar elemento
    node.appendChild(text);
 
 
}
 
window.onload = function() {
    document.getElementById( 'button_1' ).onclick = insert;
    document.getElementById( 'button_2' ).onclick = insert;
}

Un saludo!