jquery eliminar elementos html dentro de la variable (object jquery)

Dentro de HTML tengo este DIV:

<div class="teaser"> <img src="thumb1.jpg"><img src="thumb2.jpg"><br> // usually one thumb image; can be up to three some text goes here, sometimes not<br> <a href="example.html">always a link here</a><br> and sometimes another line here </div> 

Necesito capturar el contenido del DIV less la primera línea (los pulgares) en una variable para pasar como título (título) a un script lightbox. Sin embargo, en un día aprendí algo sobre JavaScript y jquery (ambos son mis puntos débiles), pero nada que encontré buscando en la web, incluidos varios hilos aquí en stackoverflow, lo hice, ya sea arrojando errores o incluso incluyendo los pulgares o eliminar el text, también, o incluso quitar los pulgares del DOM:

 // takes the whole var teaser = $(".teaser"); // TypeError: $(...).html(...).find is not a function var teaser = $(".teaser").find("img").remove(); // IMGs removed from DOM var teaser = $(".teaser").find("img").remove(); // IMGs still included; I think I understand why var teaser = $(".teaser").not("img"); // ditto var teaser = $(".teaser").clone().not("img"); // ditto: var teaser = $(".teaser"); $(teaser).find("img").remove(); // no teaser at all (everything removed, not just the IMGs) var teaser = $(".teaser"); teaser = $(teaser).find("img").remove(); // ditto var teaser = $(".teaser").clone().find("img").remove(); 

Tampoco funcionó cambiar la secuencia en los encadenamientos (aunque es posible que haya fallado uno u otro).

Esta solución parece estar bien:

 var teaser = $(".teaser").html().replace(/(<img.*?)+<br[^>]*?/i,""); 

Sin embargo, dependiendo de la implementación de expresiones regulares en los browseres, puede ser inestable, por lo que preferiría tener algo más robusto, particularmente sin get la primera línea.

TIA por cualquier sugerencia, espero poder aclararme.

Editar:

Usar clone() junto con children() o contents() me dio un paso más. Sin embargo, ambos también eliminarán el primer nodo de text, dejando dos BR vacíos detrás:

 $("div.teaser").each(function() { var teaser = $(this).clone().children().not("img"); var teaser = $(this).clone().contents().not("img"); }); 

El filter("img") OTOH filter("img") , find("img") o not("img") seguido de remove() elimina todo less los IMG, lo cual está más allá de mi cabeza, excepto para not()

 var teaser = $(this).clone().find("img").remove(); 

Editar 2:

Para concluir las cosas:

Esta es la solución sugerida por @karaxuna. Es importante reasignar la variable.

 var teaser = $(this).clone(); teaser.find("img,br:first").remove(); teaser = $.trim(teaser.html()); 

Mientras hago algunas lecturas adicionales para entender mejor la lógica detrás de los fallos y la solución final, tengo una pista para hacerlo un poco más escurridizo :

 var teaser = $(this).clone(); teaser = $.trim($("img,br:first",teaser).remove().end().html()); 

La key es el scope, o context, agregado al selector $() . Usar esto aquí es lo suficientemente familiar, sin embargo, nunca se me ocurrió usar la var. Además, end() evitará que remove() continúe hasta el DOM …

$.trim técnicamente no es necesario, por supuesto, HTML ignora las líneas vacías de todos modos.

Así que, incluyendo la solución anterior con expresiones regulares, hay al less tres forms de hacerlo, un poco me restring a Perl;)

Gracias a @karaxuna y @Ravi por compartir sus experiencias e ideas.

3 Solutions collect form web for “jquery eliminar elementos html dentro de la variable (object jquery)”

Sin necesidad de html()

 var teaser = $(".teaser").find("img").remove(); 

EDITAR:

Prueba esto:

 var teaser = $(".teaser").clone(); teaser.find("img").remove() // use teaser 

si quieres eliminar todo el html entonces puedes usar el método empty ()

 $(".teaser").empty(); 

si está eliminando solo la image. entonces

 $(".teaser").find("img").remove(); 

Es tarde, pero pruebe con este $('img',$('.teaser')).remove().end().clone()

  • ¿Cómo puedo preseleccionar un button de opción con javascript o jquery?
  • Deslizamiento de derecha a izquierda
  • ¿Cómo uso jQuery para insert tags PHP a través del DOM?
  • Google "reCaptcha" a veces no se muestra / renderizado
  • Fuerza la barra de direcciones para mostrar en la aplicación mobile de Chrome
  • TypeError no detectado: no se puede leer la propiedad "top" de null
  • exception no detectada: error de syntax, expresión no reconocida: #
  • Responsive bootstrap 3 timepicker?
  • ¿Es posible usar el drag and drop HTML5 en elementos creados dinámicamente?
  • Use el plugin jQuery con Backbone y Requirejs
  • ¿Cómo forzar que la página se actualice o se vuelva a cargar en jQuery?
  • cómo probar las funciones internas en jquery plugin?
  • ¿Cómo get el porcentaje de desplazamiento horizontal de un elemento HTML en JavaScript?
  • Javascript tiene muchos buenos JS marco (como Node.js AngularJS Vue.js React.js) es el mejor lenguaje de script.