jQuery: Cuando creo un elemento nuevo, ¿necesito la etiqueta de finalización?

Question

var $div = $('<div class="error">').appendTo($('#header')); 

Al crear nuevos elementos y agregarlos al DOM, ¿necesita la etiqueta de cierre? ¿por qué o por qué no? ¿Solo necesito la etiqueta de finalización si estoy colocando contenido en la etiqueta que estoy creando? como ese:

var $div = $('<div class="error"> Error-Homie! </div>').appendTo($('#header')); 

o podría crear un elemento con contenido en él, pero no incluir la etiqueta de cierre? ¿Bueno? ¿Malo?

var $div = $('<div class="error">').appendTo($('#header')); 

Answer 1

Aunque puede funcionar si no se utiliza una etiqueta de cierre (o al menos uno mismo cierra la etiqueta), you should add a closing tag (self-close) (como se ha mencionado, para compatibilidad entre plataformas):

Para garantizar la compatibilidad multiplataforma, el fragmento debe estar bien formado. Etiquetas que pueden contener otros elementos deben ser emparejados con una etiqueta de cierre:

$('<a href="http://jquery.com"></a>'); 

Alternativamente, jQuery permite sintaxis de las etiquetas XML-como (con o sin un espacio antes de la barra):

$('<a/>'); 

Etiquetas que no puede contener elementos pueden estar cerrados rápida-o no:

$('<img />'); 
$('<input>'); 

Esta es la forma en jQuery crea los elementos:

Si el HTML es más complejo que una sola etiqueta sin atributos, como en el ejemplo anterior, la creación real de los elementos se maneja mediante el mecanismo innerHTML del navegador. En la mayoría de los casos, jQuery crea un nuevo elemento y establece la propiedad innerHTML del elemento en el fragmento HTML que se pasó. Cuando el parámetro tiene una etiqueta única, como $('<img />') o $('<a></a>'), jQuery crea el elemento utilizando la función nativa JavaScript createElement() .

---

BTW. también puede pasar los datos como el segundo parámetro:

$('<div />', {'class': 'error', text: 'Error-Homie!'}) 

Answer 2

que necesita la etiqueta de fin: http://api.jquery.com/appendTo/ por ejemplo

$('<p>Test</p>').appendTo('.inner'); 

también debería ser

.appendTo('#header'); 

y no

.appendTo($('#header')); 

Answer 3

es probable que pueda hacerlo de esta manera

$('<div/>',{class:'error'}).html('Error-Homie!').appendTo($('#header')); 

Answer 4

Siempre necesita la etiqueta final para tener html adecuado.

Pero es un hecho que la mayoría de los navegadores permiten que se cometan esos errores. Sin embargo, no hay ninguna razón para ser flojo, no debe confiar en la tolerancia de los navegadores para que su código funcione.Esta tolerancia está ahí para poder mostrar sitios con algunos errores, no para advertir el código deliberadamente incorrecto.