RobG wrote:
RobB wrote:
[...] Mas o menos...
Which means "more or less"?
More or less. :D
[...] Opera (all) doesn't support document.stylesheets coll, be aware...
Given IE's proprietary version of cssText, the 'zilla's distaste for
outerHTML and Opera's lack of a stylesheet collection, perhaps the
simplest and most likely to work (and therefore "best"?) method is (if
Opera supports innerHTML):
1. Use getElementsByTagName to get all the style sheets
2. a. Check if stylesheet[i] has an href, and if so, write it out
b. If not, use innerHTML to get the text content
The inconsistency in the .cssText property is simple: W3C DOM exposes
it as a property of the cssRule Object, and it returns the entire
rule, selector and all, while in MSIE it belongs to the Style object
and just holds the declarations. This appears to work:
--------------------->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>untitled</title>
<link rel="stylesheet" href="simple.css" />
<style type="text/css">
..foo { color: #f00; font-weight: 800; }
span { letter-spacing: 1em; }
#feh { font-size: 200%; }
input { border: 9px white outset; padding: 6px; }
</style>
<script type="text/javascript">
//<![CDATA[
function go()
{
pop = window.open(
'pop.html',
'pop',
'left=100,top=100,width=400,height=400,status');
pop.focus();
}
//]]>
</script>
</head>
<body>
<form>
<input id="feh" type="button" value="go" onclick="go()" />
</form>
</body>
</html>
[pop.html]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>untitled</title>
<script type="text/javascript">
//<![CDATA[
if (
opener &&
!opener.closed &&
typeof document.styleSheets != 'undefined')
{
var i = 0,
el,
els = opener.document.getElementsByTagName('link');
while (el = els.item(i++))
if (el.getAttribute('rel') == 'stylesheet')
document.writeln(
'<link rel="stylesheet" href="' ,
el.getAttribute('href') ,
'" />'
);
document.writeln(
'<style type="text/css">'
);
var nsheets = opener.document.styleSheets.length,
SS, ruletype, rules, nrules, whichRule, str = '';
var sel, dec;
for (var whichSS = 0; whichSS < nsheets; ++whichSS)
{
SS = opener.document.styleSheets.item(whichSS);
ruletype = (typeof SS.rules != 'undefined') ? 'rules' : 'cssRules';
if (typeof SS[ruletype] != 'undefined')
{
rules = SS[ruletype];
nrules = rules.length;
for (whichRule = 0; whichRule < nrules; ++whichRule)
{
rule = SS[ruletype].item(whichRule);
sel = rule.selectorText;
dec = rule.style.cssText;
document.writeln(
sel ,
'{' ,
dec ,
'}'
);
}
}
}
document.writeln('</style>');
}
//]]>
</script>
</head>
<body>
<form>
<input id="feh" type="button" value="go" onclick="go()" />
</form>
</body>
</html>
[simple.css]
body {background: tan; margin: 100px;}
--------------------->
Didn't cover @-rules, easy enough to patch in. Posted this in case
anyone was interested, as the OP thoughtfully ignored my earlier
offering. Screw Opera, they had time to code document.all and
outerText but couldn't bother to expose stylesheets properly...
OK, I'm (semi-)kidding.
RobB
