Как получить значение заполнения элемента с помощью JavaScript?

Question

У меня есть textarea в моем HTML. Мне нужно получить числовое значение отступа в пикселях как целое число или число с плавающей точкой. Как я могу получить это с помощью JavaScript? Я не использую jQuery, поэтому я ищу чистые решения JavaScript.

Answer 1

Будет возвращено значение padding-left:

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

, где txt - ссылка на ваш элемент TEXTAREA.

Вышеуказанное работает во всех современных браузерах и в IE9.Однако он не работает в IE8 и ниже.

Демонстрация в реальном времени: http://jsfiddle.net/simevidas/yp6XX/

Дополнительная информация: https://developer.mozilla.org/en/DOM:window.getComputedStyle

---

Кстати, для сравнения, вот как вы выполняете ту же работу, используя jQuery:

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

Вышеописанное работает в IE6-8.

Answer 2

После поиска я нашел этот ресурс , чтобы делать то, что вы ищете.

Они хотят, чтобы вы добавили функцию 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;
}

А затем вызвать функцию, подобную этой, чтобы получить конкретный стиль:

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

Где «контейнер» - это идентификатор элемента, а «размер шрифта» - это имя свойства. Если вы можете гарантировать, что все CSS элемента будут встроены, тогда это решение будет более чистым:

document.getElementById("container").style.paddingRight;