dvtng / jss

JavaScript library for getting and setting CSS stylesheet rules
335 stars 54 forks source link

jss cannot read external css rules #21

Open mainpart opened 10 years ago

mainpart commented 10 years ago

i came to a situation when i need to check css rule of some jquery ui class loaded via external hoster stylesheet... in this case sheet.cssRules and sheet.rules arrays are empty.

Chrome. image

JSlote commented 10 years ago

I don't think JSS purports to be able to do this. It would be a good feature though!

fresheneesz commented 9 years ago

Jss creates its own stylesheet and uses it for everything. If you want to search all stylesheets, you can do the following:

var originalSheet = jss.defaultSheet // save the stylesheet so you can replace it
var styleNodes = document.querySelectorAll("style")
var results = styleNodes.map(function(node) { // loop through the stylesheets
    jss.defaultSheet = node.sheet // sets the sheet it will search
    return jss.get(selector)            // search that sheet
})
jss.defaultSheet = originalSheet  // replace the original sheet

Results will contain the list of styles for that selector from all stylesheets. Note that if there are multiple matching rules, jss combines them are combined together. I actually have no idea if jss returns all matching selectors, or only the specific selector you searched for.

I think this library could definitely use some more functionality around interacting with stylesheets like this.