Résumé des méthodes natives pour obtenir des styles dans les astuces JavaScript_javascript

ps : Il s'agit d'obtenir le style, pas de définir le style. Si aucune valeur de style n'est définie pour l'élément, la valeur par défaut donnée par le navigateur est renvoyée. (Compilation du forum)

1. element.style : ne peut obtenir que la valeur de style écrite dans l'attribut de style dans la balise d'élément, et ne peut pas obtenir la valeur de style définie dans Attributs de style chargés

Copier le code Le code est le suivant :

var ele = document.getElementById('ele');
ele.style.color; //Obtenir la couleur

2. window.getComputedStyle() : peut obtenir toutes les valeurs finales des attributs CSS de l'élément actuel.

Copier le code Le code est le suivant :

window.getComputedStyle("Element", "Pseudo-class");

Cette méthode accepte deux paramètres : l'élément à partir duquel obtenir le style calculé et une chaîne de pseudo-élément (telle que ":before"). Si les informations sur les pseudo-éléments ne sont pas requises, le deuxième paramètre peut être nul.
peut également être utilisé via document.defaultView.getComputedStyle("element", "pseudo-class");

Copier le code Le code est le suivant :

var ele = document.getElementById('ele');
var styles = window.getComputedStyle(ele,null);
styles.color; //Obtenir la couleur

Vous pouvez afficher le nombre de styles par défaut du navigateur via style.length. IE6-8 ne prend pas en charge cette méthode et vous devez utiliser la méthode la plus récente. Pour Firefox et Safari, les couleurs seront converties au format RVB.

3. element.currentStyle : spécifique à IE, renvoie la valeur finale de l'attribut CSS actuellement appliquée à l'élément (y compris les fichiers CSS de lien externe, les attributs