Obtener todos los elementos sin nodo hijo en jQuery

Necesito seleccionar elementos sin nodo hijo (incluido el texto ya que en

texto es un nodo secundario).

Utilicé empty , pero también considera el espacio como nodo hijo.

Ejemplo:

Margen:

     

Guión:

 $("span:empty").html("this was empty!"); 

Lamentablemente, solo se seleccionó y modificó el segundo elemento, ya que el primer elemento tiene espacio y se consideró nodo hijo.

¿Cómo selecciono elementos sin nodo hijo? Quiero considerar un espacio como nada. Preferiblemente, quiero que el código no use loop para seleccionarlos, puede haber otras formas.

Qué tal si

 $("span:not(:has(*))") 

Selecciona todos los tramos que no tienen hijos.

Explicación

El selector :has() “selecciona elementos que contienen al menos un elemento que coincide con el selector especificado”. El comodín * significa todos los elementos.

La expresión $('div:has(p)') coincide con un

si a

existe en algún lugar entre sus descendientes, no solo como un hijo directo.

El selector :not() “selecciona todos los elementos que no coinciden con el selector dado”.

En este caso :has() selecciona todo y luego usamos :not() para encontrar los elementos que no coinciden con “todo” … en otras palabras, nada.

Manifestación

 $.expr[":"]["no-children"] = function( elem ) { return !elem.firstChild || !$.trim(""+ elem.firstChild.nodeValue); }; $("span:no-children").html("this was empty"); 

1.

http://jsfiddle.net/k5eTS/6/

Hubo una “característica” sorprendente con $.trim jQuery que convierte null en "" mientras esperaba "null" . La conversión manual a cadena corrige esto.

Creo que puedes probar esto:

 $('span').filter(function() { return !this.innerHTML.replace(/\s/g,'').length; }); 

MANIFESTACIÓN

Prueba esto

 $("span").each(function(){ if($(this).text().trim()=='') $(this).text('Empty'); }); 

Si no te gusta cada función, entonces

 $("span").html(function(){ if($(this).text().trim()=='') return 'Empty'; });