function dom1() {
    // Schritt 1
    // neue Element- und Textknoten erzeugen:
    var ueberschrift = document.createElement("h1");
    var text = document.createTextNode("Hello World");
    
    // Schritt 2
    // Text als Kind an die Überschrift hängen:
    ueberschrift.appendChild(text);
    
    // Schritt 3
    // Überschrift als erstes Kind an den Body hängen
    var htmlBody = document.getElementsByTagName("body")[0];
    htmlBody.insertBefore(ueberschrift, htmlBody.firstChild);
}

function dom1Undo() {
    var htmlBody = document.getElementsByTagName("body")[0];
    htmlBody.removeChild(htmlBody.firstChild);
}


function aendereLinkZiel(elemId,ziel) {
    var linkElement = document.getElementById(elemId);
    var altesLinkZiel = linkElement.getAttribute("href");
    
    linkElement.setAttribute("href",ziel);
    
    return altesLinkZiel;
}

function aendereHTMLLinkZiel(elemId,ziel) {
    var linkElement = document.getElementById(elemId);
    var altesLinkZiel = linkElement.href;
    
    linkElement.href = ziel;
    
    return altesLinkZiel;
}

function lwCssAnzeigen(sheetNr) {  
    // Funktioniert für Mozilla&Co, Opera 9, MSIE 6 und 7

    var cssRules = null;

    if (document.styleSheets[sheetNr].rules) { // MSIE
	cssRules = document.styleSheets[sheetNr].rules;
    } else if (document.styleSheets[sheetNr].cssRules) { // DOM 2
	cssRules = document.styleSheets[sheetNr].cssRules;
    } 

    if (cssRules == null) {
        alert("Stylesheet nicht zugreifbar");
        return false;
    }

    var ausgabe = "";
    for (var i = 0; i < cssRules.length; i=i+1) {
	ausgabe += ( cssRules[i].cssText ? cssRules[i].cssText : cssRules[i].style.cssText) + '\n';
    }
    alert(ausgabe);
}

function lwCssRegelAnzeigen(sheetNr, index) {
    // Funktioniert für Mozilla&Co, Opera 9, MSIE 6 und 7

    var cssRegel = "";
    if (document.styleSheets[sheetNr].rules && 
	document.styleSheets[sheetNr].rules[index]) { // MSIE
        cssRegel = document.styleSheets[sheetNr].rules[index];
    } else if (document.styleSheets[sheetNr].cssRules &&
	       document.styleSheets[sheetNr].cssRules[index]) { // DOM 2
	cssRegel = document.styleSheets[sheetNr].cssRules[index];
    }

    if (cssRegel == null) {
        alert("Stylesheet nicht zugreifbar");
        return false;
    }
    
    var ausgabe = "Selektor: " + cssRegel.selectorText + "\n\n";
    
    ausgabe += "CSS-Regeln im Klartext:\n"+cssRegel.style.cssText+"\n\n";

    if (cssRegel.style.length) { // DOM 2
	for (var i = 0; i < cssRegel.style.length; i=i+1) {
	    ausgabe += "Eigenschaft " + cssRegel.style[i];
	    ausgabe += " hat den Wert " + cssRegel.style.getPropertyValue(cssRegel.style[i]) + "\n";
	}
    }
    else { // für MSIE
	for (var i in  cssRegel.style) {
	    if (cssRegel.style[i]) {
		ausgabe += "Eigenschaft " + i;
		ausgabe += " hat den Wert " + cssRegel.style[i] + "\n";
	    }
	}
    }
    alert(ausgabe);
}

// http://msdn.microsoft.com/workshop/author/dhtml/reference/dhtml_reference_entry.asp

function lwCssRegelEinfuegen(sheetNr,regel) {
    // Funktioniert für Mozilla&Co, Opera 9, MSIE 6 und 7

    var styleSheet = null;

    if (document.styleSheets[sheetNr].addRule) { // MSIE
        var styleSheet = document.styleSheets[sheetNr];

	var regelTeile = regel.split('{');
	var selektor    = regelTeile[0];
	var deklaration = regelTeile[1].split('}')[0];
	var newIndex = styleSheet.rules.length;
	styleSheet.addRule(selektor, deklaration);
	return newIndex;

    } else if (document.styleSheets[sheetNr].insertRule) { // DOM 2
        var styleSheet = document.styleSheets[sheetNr];
	return styleSheet.insertRule(regel,styleSheet.cssRules.length);
    }

    if (styleSheet == null) {
        alert("Stylesheet nicht zugreifbar");
        return false;
    }

}

function lwCssRegelLoeschen(sheetNr,index) {
    // Funktioniert für Mozilla&Co, Opera 9, MSIE 6 und 7

    if (document.styleSheets[sheetNr].removeRule) { // MSIE
        var styleSheet = document.styleSheets[sheetNr];
        if (index >=0 && index < styleSheet.rules.length) {
            return styleSheet.removeRule(index);
        } else {
            alert('Unzulässiger Indexwert');
        }
    } else if (document.styleSheets[sheetNr].deleteRule) { // DOM 2
        var styleSheet = document.styleSheets[sheetNr];
	if (index >=0 && index < styleSheet.cssRules.length) {
	    return styleSheet.deleteRule(index);
	} else {
	    alert('Unzulässiger Indexwert');
	}
    }

    if (styleSheet == null) {
        alert("Stylesheet nicht zugreifbar");
        return false;
    }
}

/*
function lwSetzeCssPropertiesNachId(id) {
    var elem = document.getElementById(id);

    for (var i=1; i+1 < arguments.length; i=i+2) {
	var propertyName  = arguments[i];
	var propertyValue = arguments[i+1];
	var elem = document.getElementById(id);
	elem.style.setProperty(propertyName,propertyValue,'');
    }
}
*/

/*
function lwCssRegelAnzeigenNachId(id) {
    var elem = document.getElementById(id);

    var ausgabe = "";

    ausgabe += "CSS-Regeln im Klartext:\n"+elem.style.cssText+"\n\n";
    
    for (var i = 0; i < elem.style.length; i=i+1) {
	ausgabe += "Eigenschaft " + elem.style[i];
	if (elem.style.getPropertyValue) {
	    ausgabe += " hat den Wert " + elem.style.getPropertyValue(elem.style[i]) + "\n";
	} else {
	    ausgabe += " hat den Wert " + eval('document.getElementById("' + id +'").' + style[i]) + "\n";
	}
    }
    alert(ausgabe);
}
*/

function lwZeigeCssText(quellId, zielId) {
    var quellElem = document.getElementById(quellId);
    var zielElem  = document.getElementById(zielId);
    
    var textKnoten = document.createTextNode(quellElem.style.cssText);
    
    if (zielElem.hasChildNodes()) {
	zielElem.replaceChild(textKnoten,zielElem.firstChild);
    } else {
	zielElem.appendChild(textKnoten);
    }
}


// 
// Varianten der Funktionen für DOM Level 0
// Vorsicht: Andere Aufrufsyntax!
//

function lwSetzeCssPropertiesNachIdDom0(id) {
    for (var i=1; i+1 < arguments.length; i=i+2) {
        var propertyName  = arguments[i];
        var propertyValue = arguments[i+1];
        eval('document.getElementById("' + id + '").style.' + propertyName + ' = "' + propertyValue + '"');
    }
}

