javascript - 无法使用 javascript 更改 css

Question

我想更改标题上的填充，以便有效地将其降低到页面上。我有以下代码运行并且什么都不做：

function openPage() {
    var i, el = document.getElementById('headbar');
    for(i=0;i<30;i++) {
        el.style.paddingTop = el.style.paddingTop + 1;
    }
}

但是，在试图弄清楚为什么它在控制台中不起作用时，我发现可能是因为填充必须以像素为单位，因为以下工作并更改了控制台中的填充：

document.getElementById('headbar').style.paddingTop='100px';

有没有什么办法可以在没有 Jquery 的情况下做到这一点，而不必制作子字符串并重新连接？

Answer 1

很简单，只需这样做：

for(i=0;i<30;i++) {
     var px = (el.style.paddingTop + 1) + "px";
     el.style.paddingTop = px;
}

Answer 2

尝试附加px到变量

 var fontSize = parseInt(el.style.paddingTop, 10);
 el.style.paddingTop = ( (!isNaN(fontSize) : fontSize : 0) + 1) + 'px';