08 March 2016

Add or remove a CSS stylesheet to HTML using plain vanilla Javascript

This little function will attach or delete a new stylesheet to your html page using good old JS. The second parameter is optional so it will toggle on or off the stylesheet, depending on it's current setting. The function will return true or false (1 or 0), depending on weather the style is on or off. Enjoy!


function toggleStylesheet(href,onoff){
    var existingNode=0 //get existing node:
    for(var i = 0; i < document.styleSheets.length; i++){
        if( document.styleSheets[i].href && document.styleSheets[i].href.indexOf(href)>-1 ) existingNode = document.styleSheets[i].ownerNode
    }
    if(onoff == undefined) onoff = !existingNode //toggle on or off if undefined
    if(onoff){ //TURN ON:
        if(existingNode) return onoff
        var link  = document.createElement('link');
        link.rel  = 'stylesheet';
        link.type = 'text/css';
        link.href = href;
        document.getElementsByTagName('head')[0].appendChild(link);
    }else{ //TURN OFF:
        if(existingNode) existingNode.parentNode.removeChild(existingNode)
    }
    return onoff
}

//EXAMPLES:

toggleStylesheet('myStyle.css') //toggle myStyle.css on or off

toggleStylesheet('myStyle.css',1) //add myStyle.css

toggleStylesheet('myStyle.css',0) //remove myStyle.css

11 comments:

Gembiraria said...

hajar wess omz AGUNGQQ Agen DominoQQ, BandarQ, Capsa Susun, QQ Online Terpercaya di Indonesia

Agen Bandar66 Online Judi Sakong Capsa BandarQ Domino99 Keris99

ituCasino Agen Bola Sbobet Piala Dunia 2018 Live Casino Online

Judi Sbobet LiveCasino 338a Agen Bola Piala Dunia Online KiosCasino

agen domino qq terpercaya said...

BwinQQ.casino agen dominoqq terpercaya

BwinQQ.casino situs dominoqq terpercaya

BwinQQ.casino situs poker online terpercaya

BwinQQ.casino agen poker terpercaya

bandarqiu99.info situs domino99 terpercaya

obat aborsi ampuh said...

cara menggugurkan kandungan

cara ampuh menggugurkan kandungan

obat aborsi

obat aborsi ampuh

cara menggugurkan kandungan said...

allways good ide for write high quality content in this blog
Cara Menggugurkan kandungan

Obat Aborsi

obat aborsi

cara menggugurkan kandungan

obat aborsi

cara menggugurkan kandungan

cara ampuh menggugurkan kandungan

cara menggugurkan kandungan

obat aborsi

obat penggugur kandungan

chenlili said...

coach outlet
michael kors outlet
nfl jerseys wholesale
christian louboutin outlet
coach outlet online
canada goose outlet
canada goose outlet store
canada goose outlet
christian louboutin sale
pandora outlet
shenyuhang20180608

Unknown said...

This is a wonderful article, obat aborsi cytotec asli Given so much info in it, These type of articles keeps the users obat aborsi surabaya interest in the website, and keep on sharing more ... good luck cara menggugurkan kehamilan.

محمد على said...

شركة تسليك مجارى بالرياض
شركة تنظيف كنب بالرياض
شركة تنظيف خزانات بالرياض
شركة عزل خزانات بالرياض

Dellam Arlowe said...

Thank you for this wonderful post. It is very informative and useful. I would like to share something here too.carpet steam cleaning

Anonymous said...

It is quite helpful that you have offered this information on your blog. We sincerely appreciate the effort you put into your article, and it helps us, too. Thank you for sharing this information.cms development

Anonymous said...

The fact that you provided this knowledge on your blog is quite beneficial. We genuinely appreciate the time and work you put into writing your article, which also benefits us. I appreciate you giving this knowledge.web development services

Anonymous said...

You have given me a very complete post about. I and those who like it think it's a fantastic piece. Your sharing of this information with us is greatly appreciated.electronic signature

Post a Comment

Cron Design Studio: Dublin based web design & software development