|
-
September 21st, 2007, 10:28 AM
#1
innerHTML in head
can I do this validly?
<script....>
var headtag = document.getElementsByTagName(head);
headtag.innerHTML += '<style>...</style>';
</script>
-
September 21st, 2007, 10:41 AM
#2
Re: innerHTML in head
Not really. To my knowledge, once the page is loaded the CSS styles are set. You can change classes, but not add different styles.
Plus, you have an error in that code anyway. The command is getElementsByTagName(). Notice that it is plural. It returns an array of all tags that match your specification.
Code:
var headtag = document.getElementsByTagName('head').item(0);
What exactly are you hoping to accomplish? Maybe we can give you a better work-around.
If the post was helpful...Rate it! Remember to use [code] or [php] tags.
-
September 21st, 2007, 11:37 AM
#3
Re: innerHTML in head
If you're injecting CSS, here's a cross-browser (not thoroughly tested, though) way to do it:
Code:
if (document.createStyleSheet) {
var style = document.createStyleSheet();
style.addRule("div.content", "display: none;");
} else {
var head = document.getElementsByTagName("head")[0];
if (head) {
var style = document.createElement("style");
style.setAttribute("type", "text/css");
style.appendChild(document.createTextNode("div.content { display: none; }"));
head.appendChild(style);
}
}
I used the above code to hide elements in a script that was located in the <head> tag (at which point no elements are programmatically accessible.)
-
September 21st, 2007, 02:19 PM
#4
Re: innerHTML in head
ill be adding LOTS of stlyes to the head upon request of the function, the stlye names will be built from variables from the rest of the script, does ur suggestion still work?
And another quick one, isnt my method also cross bwoser? any down sides? lol
thanks a lot
-
September 21st, 2007, 02:39 PM
#5
Re: innerHTML in head
The above code will work for you. It creates a new <style> tag and attaches it to the <head> tag. There should be no cross-browser issues.
If the post was helpful...Rate it! Remember to use [code] or [php] tags.
-
September 21st, 2007, 03:39 PM
#6
Re: innerHTML in head
awesome guys, thanks a lot, but to be clear, my script idea
<script....>
var headtag = document.getElementsByTagName(head);
headtag.innerHTML += '<style>...</style>';
</script>
accomplishes the same thing no?
-
September 21st, 2007, 03:59 PM
#7
Re: innerHTML in head
 Originally Posted by Kovo88
accomplishes the same thing no?
As I stated...not as it's written it won't.
The command is getElementsByTagName(). Notice that it is plural. It returns an array of all tags that match your specification.
Code:
var headtag = document.getElementsByTagName('head').item(0);
If the post was helpful...Rate it! Remember to use [code] or [php] tags.
-
September 21st, 2007, 04:34 PM
#8
Re: innerHTML in head
oh ok. because i want the script to write the style tags in the <head> tag, which is what I thought my script idea did, and of course, on one page, there is only one head tag.
thanks
-
September 21st, 2007, 04:36 PM
#9
Re: innerHTML in head
sorry peej, i just saw ur first reply :P
ok basically, i want my script to add styles on the fly after the page has loaded, so that related elements on the page would aquire the new styles.
-
September 21st, 2007, 04:47 PM
#10
Re: innerHTML in head
The smartest/best way to do it would be to use Andreas' method.
If the post was helpful...Rate it! Remember to use [code] or [php] tags.
-
September 21st, 2007, 04:54 PM
#11
Re: innerHTML in head
so if i wanted
Code:
if (document.createStyleSheet) {
var style = document.createStyleSheet();
style.addRule("div.content", "display: none; width: 500px;");
} else {
var head = document.getElementsByTagName("head")[0];
if (head) {
var style = document.createElement("style");
style.setAttribute("type", "text/css");
style.appendChild(document.createTextNode("div.content { display: none; } div.content { display: none; } div.content { display: none; } div.content { display: none; } div.content { display: none; }"));
head.appendChild(style);
}
}
just in theory of course
paying attention to 3rd line and 3rd to last line
Last edited by Kovo88; September 22nd, 2007 at 09:58 PM.
-
September 22nd, 2007, 08:36 PM
#12
-
September 22nd, 2007, 09:23 PM
#13
Re: innerHTML in head
Yes. But I hope you don't really plan to repeat div.content { display: none; } so many times. You only need it once.
Please remember to use code tags.
[code]
code goes here
[/code]
If the post was helpful...Rate it! Remember to use [code] or [php] tags.
-
September 22nd, 2007, 09:53 PM
#14
Re: innerHTML in head
of course not!!! i said in theory, i just didnt want to create dummy css
-
September 23rd, 2007, 09:46 AM
#15
Re: innerHTML in head
Code:
var headID = document.getElementsByTagName("head")[0];
var newScript = document.createElement('script');
newScript.type = 'text/javascript';
newScript.appendChild(document.createTextNode("function add" + window_number + "Script() { var my" + window_number + "Fx = new Fx.Style(\"window_" + window_number + "_wone\", \'opacity\').start(0,1);"));
newScript.appendChild(document.createTextNode("$(\"window_" + window_number + "_wone\").makeResizable({ handle:$(\"window_" + window_number + "_botright\"), container:$(\"window_" + window_number + "_wone\").getParent()});"));
newScript.appendChild(document.createTextNode("$(\"window_" + window_number + "_inner\").makeResizable({ handle:$(\"window_" + window_number + "_botright\"), container:$(\"window_" + window_number + "_wone\").getParent()});"));
newScript.appendChild(document.createTextNode("$(\"window_" + window_number + "_wone\").makeDraggable({ handle:$(\"window_" + window_number + "_handle\"), container:$(\"window_" + window_number + "_wone\").getParent()});"));
newScript.appendChild(document.createTextNode("document.getElementById(\"window_" + window_number + "_wone\").style.height = \"257px\";}"));
headID.appendChild(newScript);
With that code, for some reason, if I call it in a function, say twice... for some reason, the effected elements on the page do not aquire the effects of that script.. Is there a way to parase the script once it is injected so that other functions can call it etc...?
using eval() maybe?
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|
Reply With Quote
