web-dev-qa-db-fra.com

Comment obtenir la valeur de remplissage d'un élément en utilisant JavaScript?

J'ai un textarea dans mon HTML. J'ai besoin d'obtenir la valeur numérique de remplissage en pixels sous forme d'entier ou de flottant. Comment l'obtenir en utilisant JavaScript? Je n'utilise pas jQuery, je recherche donc des solutions JavaScript pures.

javascripthtmlpadding
56
R. Dewi

Cela renverra le padding-left valeur:

window.getComputedStyle(txt, null).getPropertyValue('padding-left')

où txt est la référence à votre élément TEXTAREA.

Ce qui précède fonctionne dans tous les navigateurs modernes et dans IE9. Cependant, cela ne fonctionne pas dans IE8 et les versions antérieures.

Démo en direct: http://jsfiddle.net/simevidas/yp6XX/

Pour en savoir plus: https://developer.mozilla.org/en/DOM:window.getComputedStyle

Btw, juste pour comparaison, voici comment vous faites le même travail en utilisant jQuery:

$(txt).css('padding-left')

Ce qui précède fonctionne dans IE6-8.

112
Šime Vidas

Après une recherche, j'ai trouvé cette ressource pour faire ce que vous cherchez à faire.

Ils veulent que vous ajoutiez une fonction javascript:

function getStyle(oElm, strCssRule){
    var strValue = "";
    if(document.defaultView && document.defaultView.getComputedStyle){
        strValue = document.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule);
    }
    else if(oElm.currentStyle){
        strCssRule = strCssRule.replace(/\-(\w)/g, function (strMatch, p1){
            return p1.toUpperCase();
        });
        strValue = oElm.currentStyle[strCssRule];
    }
    return strValue;
}

Et puis appelez la fonction comme ceci pour obtenir le style particulier:

getStyle(document.getElementById("container"), "padding-right");

Où "conteneur" est l'id de l'élément et "font-size" est le nom de la propriété. Si vous pouvez garantir que tous les CSS sur l'élément seront en ligne, cette solution serait plus propre:

document.getElementById("container").style.paddingRight;
13
Chuck Callebs