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

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

Ответ 1

Это вернет значение padding-left:

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

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

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

Live demo: http://jsfiddle.net/simevidas/yp6XX/

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

Btw, просто для сравнения, вот как вы выполняете ту же работу, что и с помощью jQuery:

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

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

Ответ 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");

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

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