JavaScript Learning Note--csstext

Usually write code, change an element style, you use

Obj.style.width = "200px"; obj.style.position = "absolute"; obj.style.left = "100px";

Code, so that if you change the style a lot of time, you have to write a lot of code, not like jquery, the use of $ (obj). css (...); Are you setting this up?

Then I searched the method of using JavaScript to modify the style in bulk. So see this article, originally there is a csstext attribute, it seems that their basic knowledge is not fully mastered

The following usage was queried in the W3school

It is a text representation of a set of style properties and their values. This text is formatted as a CSS style sheet, removing the curly braces that enclose the element selector for attributes and values.

Setting this property to an illegal value will throw a Domexception exception with code SYNTAX_ERR. When the Css2properties object is read-only, attempting to set this property throws a Domexception exception with code NO_MODIFICATION_ALLOWED_ERR.

Use of Csstext

Obj.csstext = "width:200px;position:absolute;left:100px;";

As mentioned in the article Csstext will erase the previous elements of the style, so you have to use

Obj.csstext + = "width:200px;position:absolute;left:100px;";

But the last semicolon in IE will be deleted.

Obj.csstext + = "; width:200px;position:absolute;left:100px;"; This will solve the problems that arise in IE.

But the code also seemed a little troublesome (at least in my opinion), so I looked for other ways.

Use Jsonfunction SetStyle (Obj,json) {for    (var i in JSON)    {        obj.style[i]=json[i];}    }

When using the direct

SetStyle (obj,{width: ' 200px '; position: ' absolute '; Left: ' 100px ';});

Non-Original

Original: http://rguanghui.sinaapp.com/2013/02/26/javascript_study_note_csstext/

JavaScript Learning Note--csstext