Pregunta sobre DOM con jQuery $.html() ??

[Hidek1]

Es solo una duda..

tengo una tabla..

Código HTML:

<table>
    <tr>
        <td>foo</td>
        <td>bar</td>
    </tr>
    <tr id='rescatame'>
        <td id='target'>candy</td>
        <td>mashmellow</td>
    </tr>
</table>
 

y me con jquery quiero obtener el html de un TR, incluyendolo a este, pero solo puedo acceder desde el id='target' .. (es solo un ejemplo simplificado, obiamente si fuera como este mi caso no estaria preguntando :P)
ejemplo

Código Javascript:

$(document).ready(function(){
    foo = $("#target").html();
    alert(foo);
});
 

con eso obtengo "candy" , pero necesito obtener

Código HTML:

<tr id='rescatame'>
        <td id='target'>candy</td>
        <td>mashmellow</td>
    </tr>
 

si alguien pudiera orientarme le estaría muy agradecido

saludos!

[seik!]

Iniciado por Hidek1

Es solo una duda..

tengo una tabla..

Código HTML:

<table>
    <tr>
        <td>foo</td>
        <td>bar</td>
    </tr>
    <tr id='rescatame'>
        <td id='target'>candy</td>
        <td>mashmellow</td>
    </tr>
</table>
 

y me con jquery quiero obtener el html de un TR, incluyendolo a este, pero solo puedo acceder desde el id='target' .. (es solo un ejemplo simplificado, obiamente si fuera como este mi caso no estaria preguntando :P)
ejemplo

Código Javascript:

$(document).ready(function(){
    foo = $("#target").html();
    alert(foo);
});
 

con eso obtengo "candy" , pero necesito obtener

Código HTML:

<tr id='rescatame'>
        <td id='target'>candy</td>
        <td>mashmellow</td>
    </tr>
 

si alguien pudiera orientarme le estaría muy agradecido

saludos!

No entendi del todo...

Quieres traer los td tambien? :S

si quieres el texto html del elemento seria como esto.
$("#target").text();

Emm sino podria ser algo como esto ( no lo he probado solo es teoria )

Código HTML:

<tr class='rescatame'>
        <td id='target'>candy</td>
        <td>mashmellow</td>
    </tr>
 

$(".rescatame").text();

o tal vez

$(".rescatame").html();

bueno algo asi...

si es la solucion dime.. sino sigue preguntando.

Saludos




Saludos

[Hidek1]

osea.. no ..
la pregunta va porque no es nada fijo.. es mas, es un plugin asi que debo ser lo mas abierto de mente respecto a la tabla creada ya que la puede usar cualquiera...
entonces yo dentro del plugin accedo a ese <td> por medio de un $(this), y desde ahi debo "navegar" hasta obtener el contenido del <tr> padre.. mas este mismo, es decir:

Código HTML:

<tr class='rescatame'>
        <td id='target'>candy</td>
        <td>mashmellow</td>
    </tr>
 

e intentado volver con $.parent() y luego obtener con $.html() pero no logro mi objetivo :P
gracias por el interes

[SergeMedina]

Que tal algo asi?

http://jsbin.com/ijare3/edit

Código Javascript:

var tablaFantasma = $('<table/>'),
    tr = $('tr#rescatame');
 
 
$('#ver').click(function(){
    
  var trClon = tr.clone();
  tablaFantasma.append(trClon);
  alert(tablaFantasma.find('tbody').html());
  return false;
});
 

Solo lo probe en Firefox.

[Hidek1]

Iniciado por SergeMedina

Que tal algo asi?

http://jsbin.com/ijare3/edit

Código Javascript:

var tablaFantasma = $('<table/>'),
    tr = $('tr#rescatame');
 
 
$('#ver').click(function(){
    
  var trClon = tr.clone();
  tablaFantasma.append(trClon);
  alert(tablaFantasma.find('tbody').html());
  return false;
});
 

Solo lo probe en Firefox.

si .. es como eso lo que andaba buscando.. !! no soy un maestro aún en jquery así que investigare la forma en q funciona...
PD: excelente pagina para probar los javascript.. como nunca me paso por este foro no la conocía .. agregada a mis marcadores..

muchas gracias ;D

[Hidek1]

bueno .. como me gusta seguir investigando encontré por ahí un plugin que sirve para hacer eso :P
.. lo actualice y modifique un poco para mejor compatibilidad ;D

Código Javascript:

(function($){
    $.fn.outerHTML = function(s){
        return s ? this.before(s).remove() : jQuery("<div>").append(this.eq(0).clone()).html();
    }
})(jQuery);
 

saludos! ;D

[SergeMedina]

Excelente!

outerHTML esta especificado en la API del DOM para HTML 5, estaria bien que en tu plugin utilizaras esta cuando este disponible:

Código Javascript:

var html = '';
if(this.outerHTML) {
   html = this.outerHTML();
} else {
   // tu implementación
}
 
return html;