latihan-ajax2

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Latihan Ajax</title>
    <link rel="icon" type="image/x-icon" href="https://assets-cdn.github.com/favicon.ico">
    <script language="javascript">
        function getXMLHttpRequest() {
            //jika user menggunak IE
            if (window.ActiveXObject) {
                return new ActiveXObject("Microsoft.XMLHTTP");
            } else if (window.XMLHttpRequest) {
                //user menggunakan browser selain IE
                return new XMLHttpRequest();
            } else {
                alert("Status : can not create XMLHttpRequest Object");
            }
        }

        var xmlhttp = getXMLHttpRequest();

        function sendRequest(pageUrl, elementId) {
            var obj = document.getElementById(elementId);
            obj.innerHTML = "Loading... please wait";
            if (xmlhttp.readyState == 4 || xmlhttp.readyState == 0) {
                xmlhttp.open("GET", pageUrl, true);
                xmlhttp.onreadystatechange = function () {
                    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                        var response = xmlhttp.responseText, object = JSON.parse(response);
                        obj.innerHTML = response;
                    }
                }
                xmlhttp.send(null);
            }
        }
    </script>
    <style>
        #content {
            margin-top: 20px;
        }
    </style>
</head>
<body>
    <h1>Request File Menggunakan Ajax</h1>

    <button type="button" onclick="sendRequest('ajax.php','content')">
        Klik disini
    </button>

    <div id="content">
        File request.html akan ditampilkan disini
    </div>
</body>
</html>