将CSS属性添加到元素

Question

我想添加CSS属性到我的元素。但是当我在这里用代码做这件事时，我放弃了对元素有影响的所有属性。

function checkNr(id) { 
    var value = document.getElementById(id).value; 
    if (parseFloat(value) == NaN) { 
     document.getElementById(id).setAttribute("style", "border:2px solid red; background-color: rgb(255, 125, 115);"); 
    } 
    else { 
     document.getElementById(id).setAttribute("Style", "border:default; background-color: rgb(255, 255, 255);"); 
    } 

} 

以前我用这种方法，具有的属性：

float: left; 
width: 50px; 

和后来只得到了JavaScript方法的特定属性。所以，我想添加属性而不是替换它们。

Answer 1

像这样设置样式属性，覆盖属性并删除以前设置的样式。

你真正应该做的是通过改变样式属性设置的样式，而不是直接：

function checkNr(id) { 
    var elem = document.getElementById(id), 
     value = elem.value; 
    if (parseFloat(value) == NaN) { 
     elem.style.border = '2px solid red'; 
     elem.style.backgroundColor = 'rgb(255, 125, 115)'); 
    } else { 
     elem.style.border = 'none'; 
     elem.style.backgroundColor = 'rgb(255, 255, 255)'); 
    } 
} 

Answer 2

$(this).css('border', 'default'); 

您还可以通过数组中的.css（）函数为参数。这不会覆盖您现有的CSS属性。

在你的情况，这将是这样的：

document.getElementById(id).css({ 
    border: '2px solid red;', 
    background-color: 'rgb(255, 125, 115)' 
}); 

link to javascript css() function