Sé que $("#divId").html()
me dará innerHtml. También necesito sus estilos (que pueden definirse por medio de clases) ya sea en línea style
atributo o todos los estilos/clases dentro de una etiqueta <style>
separada.jQuery - Cómo obtener todos los estilos/css (definidos en documento interno/externo) con HTML de un elemento
¿Es posible?
ACTUALIZACIÓN
¿Qué pasa si html es como <div id="testDiv">cfwcvb</div>
y una clase CSS para #testDiv
se define en la hoja de estilo externa?
ACTUALIZACIÓN 2
Lo siento por no aclarar esto antes
Si este es mi HTML
<div id="divId">
<span class="someClass">Some innerText</span>
</div>
y estilos se define en la hoja de estilos separado o en estilos de cabeza.
#divId {
clear: both;
padding: 3px;
border: 2px dotted #CCC;
font-size: 107%;
line-height: 130%;
width: 660px;
}
.someClass {
color: blue;
}
Entonces cuando trato de conseguir html interna de $("#divId").html()
o llame a cualquier otra función personalizada, necesito algo, como a continuación
<style>
#divId {
clear: both;
padding: 3px;
border: 2px dotted #CCC;
font-size: 107%;
line-height: 130%;
width: 660px;
}
.someClass {
color: blue;
}
</style>
<div id="divId">
<span class="someClass">Some innerText</span>
</div>
ACTUALIZACIÓN 3 para respuesta por kirilloid
me encontré debajo de código en la ventana de comandos de las herramientas del depurador de Chrome para la página this y esto es lo que veo TypeError: Cannot read property 'rules' of undefined
function getElementChildrenAndStyles(selector) {
var html = $(selector).get(0).outerHTML;
selector = selector.split(",").map(function(subselector){
return subselector + "," + subselector + " *";
}).join(",");
elts = $(selector);
var rulesUsed = [];
// main part: walking through all declared style rules
// and checking, whether it is applied to some element
sheets = document.styleSheets;
for(var c = 0; c < sheets.length; c++) {
var rules = sheets[i].rules || sheets[i].cssRules;
for(var r = 0; r < rules.length; r++) {
var selectorText = rules[r].selectorText;
var matchedElts = $(selectorText);
for (var i = 0; i < elts.length; i++) {
if (matchedElts.index(elts[i]) != -1) {
rulesUsed.push(CSSrule); break;
}
}
}
}
var style = rulesUsed.map(function(cssRule){
if ($.browser.msie) {
var cssText = cssRule.style.cssText.toLowerCase();
} else {
var cssText = cssRule.cssText;
}
// some beautifying of css
return cssText.replace(/(\{|;)\s+/g, "\$1\n ").replace(/\A\s+}/, "}");
// set indent for css here^
}).join("\n");
return "<style>\n" + style + "\n</style>\n\n" + html;
};
getElementChildrenAndStyles(".post-text:first");
Creo que su título debería ser "¿Cómo conseguir todos los estilos ..", también esto es similar: http://stackoverflow.com/questions/754607/can-jquery-get-all-css -styles-associated-with-an-element – thirtydot
¿Puedes decir ** por qué ** lo necesitas exactamente? tal vez hay una manera fácil de hacer esto. – galambalazs
Porque estoy copiando html de un elemento de un documento al documento de otra ventana que es un iFrame. – IsmailS