Obtenez élément StyleSheet style en JavaScript

Question

Je l'ai utilisé la fonction getStyle de John Resig de JavaScript Pro techniques pour obtenir le style des éléments:

function getStyle(elem, name) {
    // J/S Pro Techniques p136
    if (elem.style[name]) {
        return elem.style[name];
    } else if (elem.currentStyle) {
        return elem.currentStyle[name];
    }
    else if (document.defaultView && document.defaultView.getComputedStyle) {
        name = name.replace(/([A-Z])/g, "-$1");
        name = name.toLowerCase();
        s = document.defaultView.getComputedStyle(elem, "");
        return s && s.getPropertyValue(name);
    } else {
        return null;
    }
}

Cependant, cette méthode renvoie les styles par défaut pour un élément si aucun style est spécifié:

http://johnboxall.github.com/test/getStyle.html

texte alt http://img.skitch.com/20081227-8qhxie51py21yxuq7scy32635a.png

Est-il possible d'obtenir que la feuille de style styles spécifié d'un élément (et retourner null si le style est indéfini)?

Mise à jour:

Pourquoi ai-je besoin d'une telle bête? Je construis un petit composant qui permet aux utilisateurs de éléments de style. L'un des styles qui peuvent être appliqués est text-align - left, center, right - Utilisation de getStyle éléments par défaut à center sans style. Cela ne permet pas de dire si l'élément est centré parce que l'utilisateur voulait centrer ou est centrée parce que c'est le style par défaut.

Answer 1

  

Est-il possible d'obtenir seulement   styles spécifié de feuille de style un   élément (et retourner null si le style   est non défini)?

C'est effectivement ce qui est fait par la routine que vous présentez. Le problème est, dans la plupart des scénarios, la plupart des styles sont pas non définie - ils sont hérités et / ou définis par la feuille de style interne du navigateur individuel.

Vous pourriez, avec beaucoup d'effort, itérer tous des règles définissant le style en question, tous des feuilles de style dans la vue actuelle de la document les évaluer pour l'élément en question, et si aucune application ... et si aucune appliquée à un parent (ou ce style particulier n'est pas héritée) ... alors jugé non défini. Ce serait lent, et très sujettes à erreur. Je ne recommanderais pas l'essayer.

Peut-être que vous feriez mieux de prendre du recul et se demander pourquoi vous avez besoin d'une telle chose?

Answer 2

Peut-être que votre composant peut envelopper les styles qu'il contrôle? Puis, quand un style est défini par le composant le composant sait ce que l'utilisateur veut.