Kurztipp:XMLHttpRequest und innerHTML

XMLHttpRequest ist eines der bestgehüteten Geheimnisse des modernen DHTML. Falls Sie noch nie zuvor darauf gestoßen sind, handelt es sich um eine Methode, um einen HTTP-Rückruf an den Hosting-Webserver zu tätigen, ohne die gesamte Seite zu aktualisieren – eine Art Remote-Skripting auf Steroiden. Ursprünglich eine Microsoft-Erweiterung, wurde sie sowohl von der Mozilla-Browserfamilie als auch (ab Version 1.2) Safari angepasst. Die zuvor besprochene Sarissa-Bibliothek bietet eine Abstraktionsschicht für die verschiedenen Browser, oder für einen einfacheren Ansatz funktioniert dieser Code von jibbering.com (der die bedingte JScript-Kompilierung von IE verwendet) perfekt.

Um XMLHttpRequest optimal zu nutzen, müssen Sie im Allgemeinen serverseitig generiertes XML verwenden, das von Ihrer JavaScript-Anwendung abgerufen, analysiert und in komplexerer Logik verwendet werden kann. Für eine schnelle Lösung lädt der folgende Code jedoch ein HTML-Fragment von einer URL und fügt es direkt in eine Seite ein:


function loadFragmentInToElement(fragment_url, element_id) {
    var element = document.getElementById(element_id);
    element.innerHTML = '<p><em>Loading ...</em></p>';
    xmlhttp.open("GET", fragment_url);
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            element.innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.send(null);
}

Rufen Sie obige Funktion mit der URL des einzufügenden HTML-Fragments und der ID des Elements auf, in dem es erscheinen soll. Es stützt sich auf den jibbering.com-Code, um die xmlhttp-Variable einzurichten.

Es ist definitiv schnell und schmutzig, aber es ist auch eine großartige schnelle Demonstration der Leistungsfähigkeit der XMLHttpRequest-Erweiterung.