ansaurus

Question

jQuery - get CSS from everything within a div

Answer 1

+1 A:

When you use jQuery's css method, you are storing the CSS in a way that allows it to be easily applied to another element. It would be particularly long-winded, usually impractical and unusual to get the CSS for multiple selectors and store it in one variable.

You can retrieve a single CSS property of a single selector with jquery like so:

var css = $('.container').css('display');

The simplest technique of storing the CSS as a string would require you to have the CSS in the same place as the HTML (i.e. not in a seperate CSS file). You could store the css as a string by adding an ID to it like so:

<style id="my_css" type="text/css">
    .container{display:none;}
    .markup-container{color:#404040;}
    .title{text:decoration:underline;}
    .body{color:#000;}
</style>

and then store that text in your javascript with

var css = $('#my_css').text();

I've got an example of this in action up here - http://jsbin.com/umire3

Dr. Frankenstein 2010-06-20 23:06:25

I just want to clarify things. `.css( propertyName )` , `propertyName` is required.

Reigel 2010-06-20 23:30:49

thanks @Reigel +1, ammended answer

Dr. Frankenstein 2010-06-20 23:35:48

Just to be sure.It isn't possible to load the css of an external css file?And it's not possible to load all the properties at once? :)

NicoJuicy 2010-06-21 08:51:00

As @Babiker has pointed out, you can use `document.styleSheets` to grab code from external stylesheets - see http://www.quirksmode.org/dom/tests/stylesheets.html for more on this.

Dr. Frankenstein 2010-06-21 10:01:03

Answer 2

+1 A:

With plain JavaScript, you could do the following:

var styleSheet = document.styleSheets[0]; //first stylesheet.
var css='<style type="text/css">';
for(i=0; i<styleSheet.cssRules.length; i++)
 {
    css += styleSheet.cssRules[i].cssText;
 }
css = css + "</style>";

Babiker 2010-06-21 01:01:28

ansaurus

tags:

views:

answers:

jQuery - get CSS from everything within a div

related questions