Ich habe mich dazu entschieden, anstatt 3 kleiner Beispiele 1 etwas größeres Beispiel zu realisieren, das dafür mehr Funktionalität beinhaltet und eine sinnvolle Berechnung durchführt.

Es handelt sich um einen Kontrastrechner, der den Unterschied zwischen Vorder- und Hintergrund berechnet und anzeigt, ob er ausreichend groß ist. Dieses Beispiel ist auf meiner Homepage zu finden.

Hier einige ausgewählte Codeblöcke:

getRef("demo").style.background = 'rgb(' + getRef("c1").value + ',' + getRef("c2").value + ',' + getRef("c3").value + ')';

Mit dieser Zeile wird der Hintergrund des "DEMO"-Schriftzugs auf die eingegebene Farbe gesetzt. Dies erfolgt, indem die Werte der Textfelder c1 bis c3 (beinhalten die Farbwerte) ausgelesen werden und der Style "Background" des Schriftzugs auf diesen RGB-Wert gesetzt wird.

Ich benutze dazu eine Funktion getRef, um Code zu sparen. Diese Funktion sieht so aus:

function getRef(obj){
return (typeof obj == "string") ? document.getElementById(obj) : obj;
}

Demnach wird je nachdem ob bereits ein Objekt oder ein String übergeben wird, das jeweilige DOM-Objekt zurückgegeben.

Möchte man mit hexadezimalen Werten rechnen, benutze ich eine Funktion d2h, die die Umwandlung vornimmt. Diese sieht so aus:

function d2h(d) {
var h = hD.substr(d&15,1);
while (d > 15) {
d >>= 4;
h = hD.substr(d&15,1) + h;
}
return h;
}

und wird in dieser Schleife auf alle Textfelder angewandt:

for(i=1;i<7;i++) {
getRef("c"+i).maxLength = 2;
getRef("c"+i).value = d2h(getRef("c"+i).value);
}

Bei weiteren Fragen stehe ich gern zur Verfügung.