import stylesheet

#1 February 9th, 2006, 04:35 PM

Hi all, I hopen a new empty window from js code:
var win =
window.open("","debug","width=500,height=300,modal ,dialog,resizable");
and I add some element to the new window:
win.document.write("<img src="image.gif>");
win.document.write.....

How can I add the stylesheet information of the file x.css
(how and where I must write in the new window the line:
<?xml-stylesheet href="x.css" type="text/css"?> )

thanks

#2 February 9th, 2006, 07:05 PM

stefano wrote:[color=blue]
> Hi all, I hopen a new empty window from js code:
> var win =
> window.open("","debug","width=500,height=300,modal ,dialog,resizable");
> and I add some element to the new window:
> win.document.write("<img src="image.gif>");
> win.document.write.....[/color]

Which produces a very strange chunk of code of kind of:

<HTML>
<img src="image.gif>
</HTML>

<HTML> pair is still being added automatically as NN 3.0 thaught
everyone
< and > are being sent as it is, they are not converted into < >

Obviously there is neither place not sense to add a style sheet into
_it_
[color=blue]
> How can I add the stylesheet information of the file x.css
> (how and where I must write in the new window the line:
> <?xml-stylesheet href="x.css" type="text/css"?> )[/color]

You want to do something - you do it good.

1) Create and save file named blank.html in the most primitive form:
<html>
<head>
<title>Debugger</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
</head>
<body> </body>
</html>

2)
var win =

window.open("blank.html","debug","width=500,height =300,resizable=yes");

with (win.document) {
clear();
open('text/html');
write('<html><head><title>Debugger</title>');
write('<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">');
// here it goes now:
write('<link rel="stylesheet" href="my.css">');
write('</head><body>');
// anything you want to add into your page:
write(MyPageContent);
write('</body></html>');
close()
}

Overall ever since NN 4.x is gone such "from A to Z" usage of
document.write is unnecessary complicated way IMHO. It is easier to
load a page-template and change its parts using DOM methods. Up to you
anyway.

#3 February 9th, 2006, 09:05 PM

My code come from XSLT and the content of the new window is more than
one image (I can have also text, animation and sound (embed element)).
I can't create and save a file for the scope of the application I'm
working on.
I can't use DOM method because I have a lot of problem with IE (strange
things appens. For example a and b are two sibling but a.paretNode is
different of b.parentNode). I need just to add stylesheet information
if is possible in this way.

#4 February 9th, 2006, 09:35 PM

stefano wrote:[color=blue]
> My code come from XSLT and the content of the new window is more than
> one image (I can have also text, animation and sound (embed element)).
> I can't create and save a file for the scope of the application I'm
> working on.
> I can't use DOM method because I have a lot of problem with IE (strange
> things appens. For example a and b are two sibling but a.paretNode is
> different of b.parentNode). I need just to add stylesheet information
> if is possible in this way.[/color]

Unfortunately it is not possible. document.write() clears the previous
content if used after load event. And you cannot use it before load
because for that you need to have document.write() statements in the
loading page itself.
If you cannot use DOM then you cannot do it at all.
So the only option is to decide which "can't" you have to change to "I
don't like it but I have to" :-)

I would try DOM first, specially because IE has the least problem with
it, it even has a whole special method createStyleSheet for you.

Try:
win.document.createStyleSheet('myStyles.css');

P.S. I'm suspitious about XSLT you mentioned. The page you open is not
XML+XSLT combo by any chance?

#5 February 9th, 2006, 09:55 PM

I have a xml document that generate a XHTML document using XSLT. in
this document there are some span element (that contain image, text,
ecc) that are hidden. when I click on some other elements, the content
of a particular span tha was hidden should appear on a new window. The
code of the onclick method I write is:
..
..
var content=document.getElementById("content"); //the content of a
hidden span
var s=content.innerHTML;
var win =
window.open("","debug","width=500,height=300,modal ,dialog,resizable");
win.document.write(s);
win.document.close();

#6 February 10th, 2006, 01:15 AM

stefano wrote:
[color=blue]
> I have a xml document that generate a XHTML document using XSLT. in
> this document there are some span element (that contain image, text,
> ecc) that are hidden. when I click on some other elements, the content
> of a particular span tha was hidden should appear on a new window. The
> code of the onclick method I write is:
> .
> .
> var content=document.getElementById("content"); //the content of a
> hidden span
> var s=content.innerHTML;[/color]

Are you aware that .innerHTML does not return the actual element content
but what the UA could render of it? Especially it will be _HTML_, not
XHTML.
[color=blue]
> var win =
> window.open("","debug","width=500,height=300,modal ,dialog,resizable");[/color]

Thank you for pointing out the `modal' and `dialog' features I did not know
about yet. Note however, that without the UniversalBrowserWrite privilege
`modal' is equivalent to `dependent'.

<URL:http://developer.mozilla.org/en/docs/DOM:window.open>
[color=blue]
> win.document.write(s);
> win.document.close();[/color]

You missed win.document.open() before the .write().

<URL:http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-72161170>

However, that would still not write any markup to the popup's document.
There is no XML Processing Instruction, no DOCTYPE declaration, no root
element and no container element. So nothing that the stylesheet's
selectors can match reliably.

You are looking for something similar to the following:


<script type="text/javascript">
<![CDATA[
...

// to create an HTML document
win.document.write([
'<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
' "http://www.w3.org/TR/html4/strict.dtd">',
'<html>',
' <head>',
' <meta http-equiv="Content-Type"'
+ ' content="text/html; charset=iso-8859-1">',
' <title>meaningful title</title>',
' <link rel="stylesheet" href="http://example.com/x.css"'
+ ' type="text/css">',
' </head>',
' <body>',
' <div><img src="image.gif" alt="alternative content">'
+ s
+ '</div>',
' </body>',
'</html>'
].join("\n"));

// to create an XHTML document
win.document.write([
'<?xml version="1.0" encoding="iso-8859-1"?>',
'<?xml-stylesheet href="http://example.com/x.css" type="text/css"?>',
'<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
' "http://www.w3.org/TR/xhtml1/dtd/xhtml1-strict.dtd">',
'<html>',
' <head>',
' <title>meaningful title</title>',
' </head>',
' <body>',
' <div><img src="image.gif" alt="alternative content">'
+ s
+ '</div>',
' </body>',
'</html>'
].join("\n"));

...
]]>
</script>

(As you can see there is no need for escaping markup delimiters if you
declare the content of the XHTML `script' element as CDATA. However, it
is recommended to use script elements in XHTML as include only, where you
would not need to declare or escape anything.)

It is important that you specify the full URL of the stylesheet because
the generated content has no (reliable) domain.

HTH

PointedEars

#7 February 10th, 2006, 01:15 AM

Thomas 'PointedEars' Lahn wrote:
[color=blue]
> // to create an XHTML document
> win.document.write([
> '<?xml version="1.0" encoding="iso-8859-1"?>',
> '<?xml-stylesheet href="http://example.com/x.css"
> type="text/css"?>',
> '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
> ' "http://www.w3.org/TR/xhtml1/dtd/xhtml1-strict.dtd">',
> '<html>',[/color]

Argl. I forgot the namespace and stuff. The last quoted line should be
more like

'<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"'
+ ' lang="en">',

PointedEars

#8 February 10th, 2006, 01:55 PM

I try this:
<xsl:attribute name="onclick">javascript:
..
..
var content=document.getElementById("mycontent");
var s=content.innerHTML;
var loc=window.location.toString().replace(/\/([^\/])*xml/,"");
var win =
window.open("","debug","width=500,height=300,modal ,dialog,resizable");
var lll=loc+"x.css";
win.document.open() ;
win.document.write(
'<?xml version="1.0" encoding="iso-8859-1"?>' +
'<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/dtd/xhtml1-strict.dtd">'
+
'<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"' + '
lang="en">' +
' <head>'
+
'<title>meaningful title </title>'+
'<link type="text/css" rel="stylesheet" href=' +lll +" "+'/>'+
' </head>'
+
' <body>'+
' <div>'
+ s
+ '</div>'
+
' </body>'
+
'</html>'
);
win.document.close();
..
..

and also this:
<xsl:attribute name="onclick">javascript:
..
..
var content=document.getElementById("mycontent");
var s=content.innerHTML;
var loc=window.location.toString().replace(/\/([^\/])*xml/,"");
var win =
window.open("","debug","width=500,height=300,modal ,dialog,resizable");
var lll=loc+"x.css";
win.document.open() ;
win.document.write(
'<?xml version="1.0" encoding="iso-8859-1"?>' +
'<?xml-stylesheet href='+lll +' '+ 'type="text/css"?>' +
'<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/dtd/xhtml1-strict.dtd">'
+
'<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"' +
' lang="en">' +
' <head>'
+
' <title>meaningful title </title>'+
' </head>'
+
' <body>'+
' <div>'
+ s
+ '</div>'
+
' </body>'
+
'</html>'

);

win.document.close();

but the stylesheet information of the file x.css are not applied to the
new window.
help please
thanks

import stylesheet

Popular Articles

What is Bytes?