1. How to write css attributes using js
1. For css attributes without a mark, you can usually use the style. attribute name directly.
Such as: obj.style.margin, obj.style.width, obj.style.left, obj.style.position
2. For the css attribute containing the middle mark, remove each middle mark and change the first character after each middle mark to capitalize.
Such as: obj.style.marginTop, obj.style.borderLeftWidth, obj.style.zIndex, obj.style.fontFamily, etc.
3. Special writing method for js operation css float attribute
Because float is a reserved word for javascript, we cannot use obj.style.float directly, so the operation is invalid. The correct way to use it is: IE:obj.style.styleFloat, other browsers Mozilla(gecko), ff, etc. use styleFloat:obj.style.cssFloat.
2. Use js to get the css attribute value
1. Get the line Style: obj.style. attribute name. <div id="css88">JS gets the CSS attribute value</div> class cannot be accessed.
2. Get the Css attributes inside and outside of Link: IE uses the obj.currentStyle["Attribute Name"] method, and FF uses the getComputedStyle method
3. Use js to assign values to css attributes
1. Assign class attributes
Assignment: document.getElementById('ceil').className = "class1";
If it has multiple values: document.getElementById('ceil').className = "class1 class2 class3";
2. obj.style.cssText sets the css style of an object
document.getElementById('navition').style.cssText = "Your CSS code';
Summarize
Knowing how to dynamically modify the styles applied on a page is extremely useful for creating stylish and interactive web pages—the knowledge described in this article forms the basis of more advanced technologies such as JavaScript animation. It should be noted that you should use dynamic style modification responsibly and not overuse it. As mentioned earlier, style modification can also improve web efficiency - content display and hiding can help avoid unnecessary data interactions between clients and servers.