accessing head section

  • Thread starter William Starr Moake
  • Start date
W

William Starr Moake

This may be difficult to understand unless you are familiar with the
design mode feature built into Internet Explorer 5.5+. I used this
feature to develop a browser-based WYSIWYG HTML editor for offline
use, but I have run into a serious problem that I can't solve.

innerHTML and outerHTML access the <body> section of the web page
under construction, but I was able to hack together some javascript to
access the <head> section for the user to insert CSS and scripts from
popup form-based code generators. The problem is I can only access the
<head> section twice. When a third insertion of script or CSS is
attempted, it is placed in the <body> section. Amazingly, this still
works for IE, but it's bad coding and I'm sure it doesn't work in
other browsers.

Here is the first two insertions that work:

function generatecss(){
var html = opener.iView.document.body.outerHTML;
var html_txt = "<html>" + "<head>" + "<style>" +
'<!--a:hover{'+thesheet+'}-->' + "</style>\n";
opener.iView.document.write(html_txt);
}
(iView is an iframe used as an editing window for the page under
construction, 'the sheet' is the form output for CSS hover links. Note
that I ended the insertion at </style> without closing the <head>
tag.)

function metaTag(form){
var html = opener.iView.document.outerHTML;
var html_txt = "<head>" + txt + "</head>" + "<body>" + "Page Content
Begins Here" + "</body>" + "</html>\n";
opener.iView.document.write(html_txt);
}
(txt is the form output for meta tags. Note that I had to add body
text and close the <body> and <html> tags. Otherwise, the iView focus
remains in the (invisible) head section and no content can be added to
the body section.)

After hover link properties and meta tags are added, scripts and CSS
that are directed to the head section in the same way end up in the
body section instead. Any ideas about how I could change the functions
so that any number of CSS and script insertions could be made to the
head section as the page is being designed? I have code generators for
rollover buttons, popup windows etc. that require data in the head.
 
J

Jim Ley

innerHTML and outerHTML access the <body> section of the web page
under construction, but I was able to hack together some javascript to
access the <head> section for the user to insert CSS and scripts from
popup form-based code generators. The problem is I can only access the
<head> section twice. When a third insertion of script or CSS is
attempted, it is placed in the <body> section. Amazingly, this still
works for IE, but it's bad coding and I'm sure it doesn't work in
other browsers.

It almost certainly does actually, the HEAD and BODY elements are
almost completely normalised into irrelevance in all UA's

Anyway, just use document.documentElement rather than document.body
when you want to work on the whole document and not just the body.

Jim.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,770
Messages
2,569,583
Members
45,072
Latest member
trafficcone

Latest Threads

Top