2010-08-10 8 views
9

Por ejemplo, en código JavaScript que se ejecuta en la página que tienen algo así como:¿Es posible obtener objetos jquery de una cadena html que no esté en el DOM?

var data = '<html>\n <body>\n I want this text ...\n </body>\n</html>'; 

Me gustaría utilizar y por lo menos saber si es posible conseguir el texto en el cuerpo de esa cadena HTML sin tirar la toda la cadena html en el DOM y seleccionando desde allí.

+0

jquery - $ ('body'). Html() – khairil

+2

@khairil - lea la pregunta con más cuidado ... – detly

+0

opss, perdón, ignore mi comentario anterior. – khairil

Respuesta

8

En primer lugar, es una cadena:

var arbitrary = '<html><body>\nSomething<p>This</p>...</body></html>'; 

Ahora jQuery lo convierte en un fragmento DOM no asociado, aplicando su método interno .clean() para eliminar cosas como <html>, <body> extra, etc.

var $frag = $(arbitrary); 

Puede manipular esto con funciones de jQuery, incluso si todavía es un fragmento:

alert($frag.filter('p').get()); // says "<p>This</p>" 

O, por supuesto, acaba de obtener el contenido de texto como en su pregunta:

alert($frag.text()); // includes "This" in my contrived example 
         // along with line breaks and other text, etc 

Usted también puede adjuntar el fragmento al DOM:

$('div#something_real').append($frag); 

Siempre que sea posible, a menudo es una buena estrategia hacer una manipulación complicada de los fragmentos mientras están desanexados, y luego deslizarlos en la página "real" cuando haya terminado.

1

La respuesta correcta a esta pregunta, en este fraseo exacto, es NO.

Si escribe algo como var a = $("<div>test</div>"), jQuery agregará ese div al DOM, y luego construirá un objeto jQuery a su alrededor.

Si desea hacerlo sin molestar al DOM, tendrá que analizarlo usted mismo. Las expresiones regulares son tus amigos.

+0

¿Es malo agregar dinámicamente etiquetas como de forma dinámica a un div oculto? Va a estropear la página en absoluto? . Sé que definitivamente no será HTML válido, pero supongo que podría hacer algo como:

y luego hacer algo como $ ("# datos HTML") html(); – Travis

+0

Sí, puedes hacer esto, y sí, funcionará. La referencia a "HTML válido" no es relevante aquí, ya que, una vez que el navegador ha analizado el código HTML, ya no es HTML, sino un árbol DOM. También debo agregar que no tienes que envolverlo en un div. Simplemente puede pasar esa cadena completa a la función '$()', y debe devolver un objeto jQuery que represente su etiqueta 'html'. –

0

Antes de tirarlo en el DOM que es simplemente una cadena simple.

Puede usar REGEX.

1

Sería más fácil, creo, poner eso en el DOM y obtenerlo desde allí, luego quitarlo del DOM nuevamente.

Jquery está lleno de trucos como este. Está agregando todo tipo de cosas al DOM todo el tiempo, incluso cuando construyes algo usando $ ('< p> algún html </p>'). Entonces, si siguieras por ese camino, estarías efectivamente colocando cosas en el DOM y luego quitándolas de nuevo, temporalmente, excepto que sería Jquery quien lo haría.

+0

¿Qué hace $ ('

algún html

') exactamente? – Travis

+0

Crea elementos DOM a partir del HTML que le ha dado y devuelve esos elementos en un objeto Jquery, que luego puede insertar en el documento en algún lugar o hacer otras cosas. Jquery hace esto usando innerHTML y equivalentes para aprovechar el analizador HTML interno del navegador. – thomasrutter

+0

@Travis: como se indica en la documentación de jQuery (http://api.jquery.com/jQuery/#jQuery2), "... jQuery intenta crear nuevos elementos DOM como se describe en el HTML. A continuación, se crea un objeto jQuery y devuelto que se refiere a estos elementos ... " –

1

John Resig (autor de jQuery) creó un pure JS HTML parser que podría serle útil. Un ejemplo de esa página:

var dom = HTMLtoDOM("<p>Data: <input disabled>"); 
dom.getElementsByTagName("body").length == 1 
dom.getElementsByTagName("p").length == 1 

Peeeero ... Esta pregunta contiene una restricción que creo que es necesario ser más crítico de. En lugar de trabajar con una cadena HTML codificada en una variable JS, ¿no puedes reconsiderar por qué es así en primer lugar? ¿PARA QUÉ se usa esa cuerda codificada?

Si solo está allí en el guión, vuelva a escribirlo como un objeto adecuado.

Si se trata de la respuesta de una llamada AJAX, ya existe una perfectamente válida jQuery AJAX API. (Añadido:. A pesar de jQuery sólo devuelve como una cadena sin ninguna posibilidad de analizarlo, así que supongo que estás de vuelta al punto de partida allí)

Cuestiones relacionadas