API: stylesheet YAHOO.util.StyleSheet (YUI Library)

# Yahoo! UI Library

### stylesheet 2.9.0

Yahoo! UI Library > stylesheet > YAHOO.util.StyleSheet
Search:
Filters Show Private Show Protected Show Deprecated

## Class YAHOO.util.StyleSheet

Create an instance of YAHOO.util.StyleSheet to encapsulate a css stylesheet. The constructor can be called using function or constructor syntax.

    var sheet = YAHOO.util.StyleSheet(..);

or

    var sheet = new YAHOO.util.StyleSheet(..);

The first parameter passed can be any of the following things:

- The desired string name to register a new empty sheet
- The string name of an existing YAHOO.util.StyleSheet instance
- The unique yuiSSID generated for an existing YAHOO.util.StyleSheet instance
- The id of an existing `<link>` or `<style>` node
- The node reference for an existing `<link>` or `<style>` node
- A chunk of css text to create a new stylesheet from

If a string is passed, StyleSheet will first look in its static name registry for an existing sheet, then in the DOM for an element with that id. If neither are found and the string contains the { character, it will be used as a the initial cssText for a new StyleSheet. Otherwise, a new empty StyleSheet is created, assigned the string value as a name, and registered statically by that name.

The optional second parameter is a string name to register the sheet as. This param is largely useful when providing a node id/ref or chunk of css text to create a populated instance.

### Constructor

YAHOO.util.StyleSheet `( seed , name )`

Parameters:
  `seed <String|<style> element>` a style or link node, its id, or a name or yuiSSID of a StyleSheet, or a string of css text (see above)
  `name <String>` OPTIONAL name to register instance for future static access

### Properties

#### node - `HTMLElement`

The <style> element that this instance encapsulates

### Methods

#### disable

`StyleSheet disable ( )`
Disable all the rules in the sheet. Rules may be changed while the StyleSheet is disabled.

Returns: `StyleSheet`
  the instance

Chainable: This method is chainable.

#### enable

`StyleSheet enable ( )`
Enable all the rules in the sheet

Returns: `StyleSheet`
  the instance

Chainable: This method is chainable.

#### getCssText

`String getCssText ( sel )`
Get the current cssText for a rule or the entire sheet. If the selector param is supplied, only the cssText for that rule will be returned, if found. If the selector string targets multiple selectors separated by commas, the cssText of the first rule only will be returned. If no selector string, the stylesheet's full cssText will be returned.

Parameters:
  `sel <String>` Selector string

#### getId

`Number getId ( )`
Get the unique yuiSSID for this StyleSheet instance

Returns: `Number`
  the static id

#### isEnabled

`Boolean isEnabled ( )`
Returns boolean indicating whether the StyleSheet is enabled

Returns: `Boolean`
  is it enabled?

#### set

`StyleSheet set ( sel , css )`

Set style properties for a provided selector string. If the selector includes commas, it will be split into individual selectors and applied accordingly. If the selector string does not have a corresponding rule in the sheet, it will be added.

The second parameter can be either a string of CSS text, formatted as CSS ("font-size: 10px;"), or an object collection of properties and their new values. Object properties must be in JavaScript format ({ fontSize: "10px" }).

The float style property will be set by any of "float", "styleFloat", or "cssFloat" if passed in the object map. Use "float: left;" format when passing a CSS text string.

Parameters:
  `sel <String>` the selector string to apply the changes to
  `css <Object|String>` Object literal of style properties and new values, or a string of cssText

Returns: `StyleSheet`
  the StyleSheet instance

Chainable: This method is chainable.

#### StyleSheet.isValidSelector

`static Boolean StyleSheet.isValidSelector ( sel )`

Determines if a selector string is safe to use. Used internally in set to prevent IE from locking up when attempting to add a rule for a "bad selector".

Bad selectors are considered to be any string containing unescaped `~!@$%^&()+=|{}[];'"?< or space. Also forbidden are . or # followed by anything other than an alphanumeric. Additionally -abc or .-abc or #_abc or '# ' all fail. There are likely more failure cases, so please file a bug if you encounter one.

Parameters:
  `sel <String>` the selector string

#### StyleSheet.register

`static Boolean StyleSheet.register ( name , sheet )`
Registers a StyleSheet instance in the static registry by the given name

Parameters:
  `name <String>` the name to assign the StyleSheet in the registry
  `sheet <StyleSheet>` The StyleSheet instance

Returns: `Boolean`
  false if no name or sheet is not a StyleSheet instance. true otherwise.

#### StyleSheet.toCssText

`static String StyleSheet.toCssText ( css , cssText )`

Converts an object literal of style properties and values into a string of css text. This can then be assigned to el.style.cssText.

The optional second parameter is a cssText string representing the starting state of the style prior to alterations. This is most often extracted from the eventual target's current el.style.cssText.

Parameters:
  `css <Object>` object literal of style properties and values
  `cssText <String>` OPTIONAL starting cssText value

Returns: `String`
  the resulting cssText string

#### unset

`StyleSheet unset ( sel , css )`

Unset style properties for a provided selector string, removing their effect from the style cascade.

If the selector includes commas, it will be split into individual selectors and applied accordingly. If there are no properties remaining in the rule after unsetting, the rule is removed.

The style property or properties in the second parameter must be the

JavaScript style property names. E.g. fontSize rather than font-size.

The float style property will be unset by any of "float", "styleFloat", or "cssFloat".

Parameters:
  `sel <String>` the selector string to apply the changes to
  `css <String|Array>` style property name or Array of names

Returns: `StyleSheet`
  the StyleSheet instance

Chainable: This method is chainable.

Copyright © 2011 Yahoo! Inc. All rights reserved.