Js css style operation code (batch operation)

Using JavaScript to control css styles allows a webpage to achieve a good user experience or even an animation effect. Efficiency is also taken into account. We usually use the following two methods to write css styles using js:

In general, we use js to set the style of element objects in this form:

Copy to ClipboardReference: [www.bkjia.com]
Var element = document. getElementById ("id ");
Element. style. width = "20px ";
Element. style. height = "20px ";
Element. style. border = "solid 1px red ";

However, the above method has a disadvantage. There are many styles and a lot of code. Besides, overwriting object styles through JS is a typical process of destroying and recreating original styles, such destruction and reconstruction will increase the browser overhead.
Js has a cssText method:
Syntax: obj.style.css Text ("style ");
The above code can be modified:

Copy to ClipboardReference content: www.bkjia.comw.element.style.css Text = "width: 20px; height: 20px; border: solid 1px red;"; this method can avoid repeated page reflow and improve page performance.