Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

$.getScript, but for stylesheets in jQuery?

Is there a $.getScript equivalent in jQuery, but for loading stylesheets?

like image 397
Lucas Avatar asked Feb 17 '13 09:02

Lucas


1 Answers

CSS is not a script, so you dont have to "execute" it in the sense of script execution.

Basically a <link> tag created on the fly and appended to the header should suffice, like

$('<link/>', {    rel: 'stylesheet',    type: 'text/css',    href: 'path_to_the.css' }).appendTo('head'); 

or

var linkElem = document.createElement('link'); document.getElementsByTagName('head')[0].appendChild(linkElem); linkElem.rel = 'stylesheet'; linkElem.type = 'text/css'; linkElem.href = 'path_to_the.css'; 

if you want to do it without jQuery.

The browser will respond to the change in the DOM and update your page layout accordingly.


EDIT:

I have read that old Internet Explorer has trouble with this, and you might need to do it like in answer to make it work:

https://stackoverflow.com/a/2685639/618206


EDIT2:

Reading the file content and putting it inline (between <style> tags) is also a valid solution, but that way the CSS will not be cached by the browser.

like image 55
vinczemarton Avatar answered Sep 22 '22 11:09

vinczemarton