agregar elementos dom con javascript

[juanito1712]

aparte de hacer una guarrada semejante

Código:

			$("#movie_list").append(
				"<li class='movie_cover'>"+
					"<div class='cover'>"+
						"<div class='over'>"+
							"<div class='question'>"+
								"<img onclick='show_trailer(\""+link+"\")' src='http://www.iconsdb.com/icons/preview/white/info-5-xxl.png'>"+
							"</div>"+
						"<div class='play'>"+
							"<img  onclick='play_movie(\""+link+"\")' src='http://www.iconsdb.com/icons/preview/white/video-play-xxl.png'>"+
						"</div>"+
					"</div>"+
				"<img width='100%' src='"+image+"'/>"+
				"</div><div class='title'>"+title+"</div></li>");

o crear los elementos metiendo mano al dom

¿hay alguna solución un poquito mas elegante sin llegar recurrir a templates?

[caricatos]

Hola:

Con javascript se usa appendChild o insertBefore... e innerHTML.

Lo que usas depende de alguna librería.

Saludos

[mpozo]

insert* y innerHTML están bastante desactualizados. Se recomienda usar insertAdjacent*

[Panino5001]

Iniciado por mpozo

insert* y innerHTML están bastante desactualizados. Se recomienda usar insertAdjacent*

¿Estás recomendando un método con status WD (Working Draft)?

[mpozo]

Entiendo que estés confuso. El vinculo redirecciona a insertAdjacentHTML() pero insertAdjacetElement() es LS al igual que insetAdjacentText(). Recomiendo insertAdjacentHTML(), aún estando con ese estado, por que las ventajas contra innerHTML son más que evidentes. Que hoy en día tenga ese estado no implica nada positivo ni negativo.

[Triby]

Cuáles son las ventajas evidentes?

https://jsperf.com/insertadjacenthtml-perf/3

[mpozo]

Puede que estén equivocados
https://developer.mozilla.org/es/doc...rtAdjacentHTML

insertAdjacentHTML() analiza la cadena de texto introducida como cadena HTML o XML e inserta al árbol DOM los nodos resultantes de dicho análisis en la posición especificada. Este método no re-analiza el elemento sobre el cual se está invocando y por lo tanto no corrompe los elementos ya existentes dentro de dicho elemento. Esto evita el paso adicional de la serialización, haciendolo mucho más rápido que la manipulación directa innerHTML.

https://hacks.mozilla.org/2011/11/in...pet-injection/
https://davidwalsh.name/insertadjacenthtml-beforeend