@@molily:

nuqneH

var color, fontSize;

if (diff < 1) { color = 0xF1630C; fontSize = 150; }
else if (...) ...
var style = spans[q].style;
style.color = '#' + color.toString(16);
style.fontSize = fontSize + %'

  
Wozu color und fontSize erst als Zahlen und dann in Strings umwandeln? Dann doch gleich  
`if (diff < 1) { color = '#F1630C'; fontSize = '150%' }`{:.language-javascript}  
  
Als Datenmodell für RGB ist eine Zahl untauglich; es sind ja drei. Also wenn schon, denn schon:  
`if (diff < 1) { color_r = 0xF1; color_g = 0x63; color_b = 0x0C; … }`{:.language-javascript}  
oder  
`if (diff < 1) { color = [0xF1, 0x63, 0x0C]; … }`{:.language-javascript}  
und daraus den String '#F1630C' oder den String 'rgb(241, 99, 12)' generieren.  
  
Ein Integer ist auch nicht das richtige Datenmodell für die relative Angabe der Schriftgröße:  
`if (diff < 1) { … fontSize = 1.5; }`{:.language-javascript}  
und daraus den String '150%' generieren.  
  
Aber nichts von alledem sollte man wirklich tun. Wo blieb denn deine Predigt für die Trennung von Verhaltens- und Präsentationsschicht?  
  
Im Script sollte lediglich stehen:  
~~~javascript
if (diff<1) spans[q].className = 'diffrange_0_1';  
else if (diff<4) spans[q].className = 'diffrange_1_4';  
else if (diff<10) spans[q].className = 'diffrange_4_10';  
else if (diff<15) spans[q].className = 'diffrange_10_15';

Die Darstellungsangaben stehen dort, wo sie hingehören – im Stylesheet:

.diffrange_0_1   { color: #f1630c; font-size: 150% }  
.diffrange_1_4   { color: #d96117; font-size: 130% }  
.diffrange_4_10  { color: #fa670c; font-size: 120% }  
.diffrange_10_15 { color: #eb6513; font-size: 110% }

Qapla'