JavaScript dynamically modifies CSS styles

Method One: Change the external CSS file, this is not spoken here.

Method Two: By changing the claaname to change the style, syntax:

Obj.classname = "Style2"; // or Obj.setattribute ("Class", "Style2");

Method Three: Use Obj.style.cssTest, Syntax:

Obj.style.cssText = "Display:block; Color:white; "

Advantages of this method:

You can add several properties like this.

Cons: Will clear the original csstext of obj, Solution: Use additive, Syntax:

Obj.style.cssText + = "display:block; Color:white; "

The above Csstext cumulative method is not valid in IE.

However, you can add a semicolon to the front to fix the problem:

Obj.style.cssText + = "; Display:block; Color:white; "

Note : If the style sheet file is preceded by a div {text-decoration:underline;}, will this be overwritten? No! Because it is not a style property that directly acts on the HTML element.

Method Four: Use Obj.style.backgroundColor, Syntax:

Obj.style.backgroundcolor= "BLACK";

Note: BackgroundColor can be replaced by other properties, here are just examples, such as color,position.

One last point of knowledge: CSS Sprite,

is to have a big picture, by controlling the background-position to realize a part of the large image. Can be used to make animations. This large figure is as Background-image:.

The advantage is to reduce the HTTP request, the disadvantage is to locate trouble. Maintenance trouble.

For specific usage, please visit: 24181675

JavaScript dynamically modifies CSS styles