array javascript

[dukeblass]

Holas buenas, una consulta tengo este array

visto por el console.log chrome

[<li class=​"7">​…​</li>​,<li class=​"8">​…​</li>,<li class=​"9">​…​</li>​,<li class=​"10">​…​</li>]


cuando intento acceder a cada uno e insertarlo en una UL lo que imprime es

[object HTMLLIElement][object HTMLLIElement][object HTMLLIElement][object HTMLLIElement]

como podría hacer esto..

[zerokilled]

¡buenas!
no entiendo mucho. ¿cómo obtienes el array? ¿cómo insertas el elemento? en dónde se imprime el texto, ¿en la consola o en el navegador? ¿qué exactamente es lo que quieres hacer? entiendo que quieres agregar elementos LI a un UL, pero no está claro de donde viene ni mucho menos cómo lo estás haciendo.

[dukeblass]

Iniciado por zerokilled

¡buenas!
no entiendo mucho. ¿cómo obtienes el array? ¿cómo insertas el elemento? en dónde se imprime el texto, ¿en la consola o en el navegador? ¿qué exactamente es lo que quieres hacer? entiendo que quieres agregar elementos LI a un UL, pero no está claro de donde viene ni mucho menos cómo lo estás haciendo.

vale, mira tengo un array que lo construllo con un for

Código Javascript:

....
for(li=0;li<lis.length;li++){
        n++;tamLis+=js.tam(lis[li]).an;
        if(tamLis<tamVis){
            tamLisT+=js.tam(lis[li]).an+2;          
        } else {
            liOc[n]=lis[li]; // aki se guarda el array que son LI
        }
    }
...
 

luego viendo en consola este array liOc es:
[<li class=​"7">​…​</li>​,<li class=​"8">​…​</li>,<li class=​"9">​…​</li>​,<li class=​"10">​…​</li>]

para imprimir el array dentro del UL

recorro el array

Código Javascript:

... 
var mus='';
    for(ic=0;ic<liOc.length;ic++){
        mus+=liOc[ic];      
    }
 

e inserto con innerHTML al UL la variable mus
y como resultado de la impresión sale: [object HTMLLIElement][object HTMLLIElement][object HTMLLIElement][object HTMLLIElement]

en el código quedaría

Código HTML:

... 
<ul>[object HTMLLIElement][object HTMLLIElement][object HTMLLIElement][object HTMLLIElement]</ul>
...
 

cuando tendría que quedar

Código HTML:

... 
<ul>
<li class=&#8203;"7">​…​</li>
​<li class=&#8203;"8">​…​</li>
<li class=&#8203;"9">​…​</li>​
<li class=&#8203;"10">​…​</li>
</ul>
...
 

[zerokilled]

la forma que lo agregas está mal. DOM no es lo mismo que trabajar con string. cuando obtienes un elemento del DOM, dicho elemento representa un objeto. si intentas concatenarlo a un string lo que sucede es que javascript coerce el objeto a string para poder realizar la operación de concatenar. por eso todos los elementos los ve como [object HTMLLIElement]. tienes que decidir como hacerlo, completamente por métodos DOM o por strings de código html.

si decides por strings, tienes que tomar el código html de ese elemento, concatenarlo a la variable, y luego agregarlo al destino. es decir, para obtener el código lees la propiedad innerHTML o outerHTML. si lo haces por innerHTML, también tienes que concatenarle al inicio y final del string las etiquetas de apertura y cierre LI, ya que innerHTML sólo lee el contenido interno del elemento. con outerHTML no tienes que preocuparte porque este incluye al elemento en si mismo. sin embargo, tengo mis dudas de si la mayoría de los navegadores tienen soporte para este último.

si lo haces completamente por DOM, debes considerar si quieres mover los elementos de su origen al destino. una vez tengas las referencias de los elementos a incluir, pasa cada referencia por el método appendChild del elemento destino. si lo que quieres es copiar el elemento al nuevo destino, entonces primero tienes que clonar el elemento con el método cloneNode desde el elemento que quieres copiar. el método te devuelve un clon y lo agregas al destino de la misma forma anterior, appendChild.

Código:

var destino, origen; // asumiendo que ambas variables contiene la referencia de los elementos;
var lista; // asumiendo que lista es el array de elementos LI;

// para mover del origen al destino;
destino.appendChild(lista[#]); // lo habitual seria ubicar esta linea en un bucle para recorrer el array

// para clonar el elemento y agregarlo al destino;
// desde el bucle que agrega los elementos al array;
lista.push(LI[#].cloneNode(true)); // asumiento que LI[#] es un elemento <LI> en cada iteracion;
// para agregarlo al destinto haces como el ejemplo anterior, recorres el array y pasas cada elemento por appendChild;

// o bien puedes agregar el elemento en un solo bucle al momento de clonar;
destino.appendChild(LI[#].cloneNode(true));