2012-09-07 8 views
12

Estoy tratando de hacer una presentación de diapositivas de imágenes y todo lo que tengo es un editor de texto enriquecido para ingresar las imágenes y el texto. Así que de este html:jQuery seleccionar HTML entre dos identificadores de cadena

<h1>title</h1> 
<p>description...</p> 

<p>#slider</p> 

<p><img src="a.jpg" /></p> 
<p><img src="b.jpg" /></p> 
<p><img src="c.jpg" /></p> 

<p>#end-slider</p> 

¿Cómo se selecciona el html entre #slider y # extremo deslizante?

Es un concepto similar a la extracción de texto entre [link] y [/ link] en el blog de comentarios, por ejemplo: [link] http://google.com [/ link]

+0

es '# slider' un ID de contenido o texto? – undefined

+0

#slider es solo texto –

+2

No exactamente "similar", el corchete '[tags]' solo puede ser analizado por regex - y generalmente se hace en el lado del servidor para desinfectar (etiquetas anidadas, etc.). Ahora estás presentando elementos DOM reales con nodos de texto, seguro que * podrías * analizarlos con expresiones regulares, pero hay mejores formas de evitarlos. –

Respuesta

6

Prueba esto:

$('p:contains("#slider")').nextUntil('p:contains("#end-slider")') 

actualización:

var end = $('p:contains("#end-slider")'); 
$('p:contains("#slider")').nextUntil(end).andSelf().add(end) 

http://jsfiddle.net/63kQC/

+0

¡Gracias, funcionó bien! También me pregunto si hay una manera de seleccionarlo todo, entonces los identificadores y el html es decir #slider html # end-slider? –

+0

@PaulMason Sí, prueba el código actualizado. – undefined

+0

¡Excelente! Gracias –

8
$(document).ready(function() { 
    $('p:contains("#slider")') 
     .nextUntil('p:contains("#end-slider")') 
     .wrapAll("<div id='stuff'></div>"); 
    var required = $('#stuff').html(); 
}); 

http://jsfiddle.net/483kL/

+1

awesome :) :) :) :) – AdityaParab

+1

Por supuesto, el selector ': contains' puede atrapar algunas cosas no deseadas, p. '

#slider *** headkeyboard *** dsgdfhdfjdfj

'. Sin embargo, OP puede estar bien con eso. –

2

probar este

$(document).ready(function(){ 
    $('p:contains("#slider")').nextUntil('p:contains("#end-slider")'); 
}); 
Cuestiones relacionadas