Javascript définissant un objet dom comme une variable

Question

document.getElementById("sgun").style.backgroundColor = "#00FA9A"; 

Je voudrais définir document.getElementById et style.backgroundColor = "# 00FA9A"; en tant que variable, le code n'a pas l'air horrible, et je n'ai pas besoin de copier-coller cela pour chaque élément. Comment faire je fais ça?

Answer 1

Vous pouvez tout simplement une fonction qui prend une carte d'identité et un style et le faire pour vous comme:

function css(id, prop, value){ 
    document.getElementById(id).style[prop] = value; 
} 

puis l'utiliser comme:

css('sgun', 'backgroundColor', '#00FA9A'); 
// css(...); 

Et si vous voulez une fonction qui change juste la couleur de fond à '# 0 utilisation 0FA9A ceci:

function bg(id){ 
    document.getElementById(id).style.background = '#00FA9A'; 
} 

et de l'utiliser comme:

bg('sgun'); 
bg('someotherid'); 
// ... 

Answer 2

Je vous conseillerais d'en faire une fonction.

function changeBgColor(el) { 
 
document.getElementById(el).style.backgroundColor = '#00fa9a'; 
 
} 
 
changeBgColor('foo'); 
 
changeBgColor('bar');

<div id="foo">asdf</div> 
 
<div id="bar">asdf</div>