JavaScript Intensive tutorial--style, Currentstyle, getComputedStyle difference Introduction

h5edu  Tutorial, Main introduction: JavaScript Intensive tutorial  -- style, Currentstyle, getComputedStyle differences Introduction

Style, Currentstyle, getcomputedstyle differences introduced the stylesheet has three ways inline style (Inline style)  : is written in tag, the inline style is only valid for all tags. Internal style (Internal style sheet): is written in the inside of the HTML, the internal style is only valid for the page on which it resides. External style sheet (External style sheet): If many Web pages need to use the same style (styles), write the style (styles) in a CSS file with a. css suffix, and then use each of these styles ( The CSS file is referenced in the Web page of Styles.   Most commonly used is the style property, in JavaScript, by document.getElementById (ID). style. XXX can get the value to XXX, but unexpectedly, this can only be taken to the style value set by inline mode, that is, the value set inside the Style property. Solution: Introduce the currentstyle,runtimestyle,getcomputedstyle style  standard style, which may be specified by the Style property! runtimestyle  run-time style! If the properties of the style overlap, the properties of the style will be overwritten! currentstyle  refers to the combination of  style  and  runtimeStyle !   Through Currentstyle, you can get values for CSS styles that are referenced inline or externally (ie only)   such as: document.getElementById ("Test"). Currentstyle.top to be compatible with FF, we need to getcomputedstyle . Note:  getcomputedstyle is in Firefox,  currentstyle is in IE .  such as <style> #mydiv  {     width : 300px;} </style>: Var mydiv = document.getelementbyid (' mydiv '); if (Mydiv.currEntstyle)  {      var width = mydiv.currentstyle[' width ';       alert (' ie: '  + width);}  else if (window.getComputedStyle)  {      var width =  window.getcomputedstyle (mydiv , null) [' Width '];      alert (' Firefox: '  + width);} The 12document.defaultview.getcomputedstyle (Mydiv,null) can also be obtained under FF in the following way. Width;window.getcomputedstyle (mydiv  , null). Width;

This article is from the "11721999" blog, please be sure to keep this source http://11731999.blog.51cto.com/11721999/1851846

JavaScript Intensive tutorial--style, Currentstyle, getComputedStyle difference Introduction