##Simple AJAX example
- New request
- Callback
- Open
- Send
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<link href='//fonts.googleapis.com/css?family=Varela+Round' rel='stylesheet' type='text/css'> | |
<link rel="stylesheet" href="css/main.css"> | |
<title>AJAX with JavaScript</title> | |
<script> | |
var xhr = new XMLHttpRequest(); | |
xhr.onreadystatechange = function () { | |
if ( xhr.readyState === 4 ) { | |
document.getElementById("ajax").innerHTML = xhr.responseText; | |
} | |
}; | |
xhr.open('GET', 'sidebar.html'); | |
xhr.send(); | |
</script> | |
</head> | |
<body> | |
<div class="grid-container centered"> | |
<div class="grid-100"> | |
<div class="contained"> | |
<div class="grid-100"> | |
<div class="heading"> | |
<h1>Bring on the AJAX</h1> | |
</div> | |
<div id="ajax"> | |
</div> | |
</div> | |
</div> | |
</div> | |
</div> | |
</body> | |
</html> |