However, DOM.style can only access , so the style built into the tag, if the style is written in < ;/style>, or in a .css file, then you can read the style. <br><br>Actually, there are other ways to read this style information. There are two methods, one is through the document.styleSheets object, and the other is through the "final style" object. Among them, this object is called currentStyle in IE and document.defaultView in FF. I packaged these two classes and made a function for accessing style information, as follows: <br></p> <div class="codetitle"> <span><a style="CURSOR: pointer" data="49299" class="copybut" id="copybut49299" onclick="doCopy('code49299')"><u>Copy code</u></a></span> Code As follows: </div> <div class="codebody" id="code49299"> <br>//============================Access style sheet functions====== ============================== <br>function returnStyle(obj,styleName){ <br>var myObj = typeof obj = = "string" ? document.getElementById(obj) : obj; <br>if(document.all){ <br>return eval("myObj.currentStyle." styleName); <br>} else { <br>return eval ("document.defaultView.getComputedStyle(myObj,null)." styleName); <br>} <br>} <br> </div> <br>The function has two parameters: <br><br>obj: accessed Object, type is DOM object, or the id of the object; <br><br>styleName: The name of the style that needs to be accessed. The type is string, but the name cannot use the "-" sign. It must use a mixed case name like the attribute name of the style. object. For example, background-color should be written as backgroundColor. <br><br>The function return value is string type. <br><br>Note: This method can only access style files and cannot write. If you want to write styles, you still have to use the DOM.style.XXX method. In addition, there are some style access problems under FF, such as padding and margin. If padding, margin and other values are set in the style, we can use marginLeft to return the value. <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="41013" class="copybut" id="copybut41013" onclick="doCopy('code41013')"><u>Copy code</u></a></span> The code is as follows:</div> <div class="codebody" id="code41013"> <br><!DOCTYPE html PUBLIC "-//W3C/ /DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> .org/1999/xhtml"> <br><head> <br><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <br> <style type="text/css"> <br>#demo{background-color:#000;padding:10px;color:#fff;width:200px;} <br> <br>//============================Access style sheet=== ================================= <br>function returnStyle(obj,styleName){ <br>var myObj = typeof obj == "string" ? document.getElementById(obj) : obj; <br>if(document.all){ <br>return eval("myObj.currentStyle." styleName); <br>} else { <br>return eval("document.defaultView.getComputedStyle(myObj,null)." styleName); <br>} <br>} <br> Here is the test content Click Test