bases DOM (sept)

La ligne entre la feuille de style CSS

• dom.style (inscriptible aucun problème de compatibilité)

• La valeur doit être écrite comme une chaîne de caractères

• Combinaison de mots dans une petite écriture de style bosse

• Essayez le démantèlement des propriétés composites

• Pour cet attribut flotteur mot réservé précédé css

  • par exemple: float -> cssFloat

CSS scriptée

• le style de calcul de requête (lecture seule à moins de navigateur IE9 n'est pas compatible)

  • window.getComputedStyle (elem, NULL);

  • Calcul de la valeur des valeurs absolues sont modèle est revenu, pas d'unités relatives, ainsi appelé style calculé

    // html
    <div style="width: 10em"></div>
    // js
    window.getComputedStyle(div, null).width;  // "160px"
  

  • Le second paramètre peut être lu en utilisant motif pseudo-élément

    // html
    <div></div>
  
    // css
    div {
      width: 200px;
      height: 200px;
      background-color: #000;
    }
    div::after {
      content: '';
      width: 100px;
      height: 100px;
      display: block;
      background-color: red;
    }
  
    // js
    var oDiv = document.getElementsByTagName('div')[0];
    window.getComputedStyle(oDiv, 'after').width        // "100px"
  

  • Retour à tous les éléments de styles exposition, y compris le style en ligne, les valeurs par défaut de style, etc.

    // html
    <div style="width: 100px; height: 100px;background-color: red;"></div>
  
    // css
    div { width: 200px !important; }
  
    // js
    var oDiv = document.getElementsByTagName('div')[0];
    oDiv.style.width                                      // 100px
    window.getComputedStyle(oDiv, null).width             // 200px
  

• Pour moins que la version du navigateur IE9

  • le style de calcul de requête (lecture seule) utilisation: elem.currentStyle

  • Cependant, la valeur de retour est la valeur absolue du converti