Javascript component

[marcus6]

If I write a javascript object that needs an inclusion of a .css file in order to be displayed nicely on the webpage...

...how can I link the .css file into the html page only by including the .js file? (so that the user only includes the .js file and the rest goes "automatically" ?)

(suppose the path to the css is the same as for the .js)

Any good ideas?

[dmjpro]

If I write a javascript object that needs an inclusion of a .css file in order to be displayed nicely on the webpage...

...how can I link the .css file into the html page only by including the .js file? (so that the user only includes the .js file and the rest goes "automatically" ?)

(suppose the path to the css is the same as for the .js)

Any good ideas?

look at this example .....

var css_link = document.createElement('LINK');
css_link.setAttribute('rel','stylesheet');
css_link.setAttribute('href','css_file_name');
document.body.appendChild(css_link); //This line i have confusion
 

try this ..... i think it ll work
have a good day

kind regards,
dmjpro.

[mrhoo]

link elements belong in the head.
this method firsts checks to see if the link is already loaded.
If it is, it moves it to the sharp end of the cascade,
otherwise it creates a new link element.

window.addLink= function(url,t){
    var A= document.getElementsByTagName('link');
    var L= A.length, el;
    for(var i= 0; i< L; i++){
        if(A[i].href==url){
            el= A[i];
            break;
        }
    }
    if(!el){
        el=document.createElement('link');
        el.rel="stylesheet";
        el.type="text/css";
        el.media="screen";
        el.href=url;
        if(t) el.title= t;
    }
    return document.getElementsByTagName('head')[0].appendChild(el);
}