Skip to content

Instantly share code, notes, and snippets.

@gotpop
Last active June 20, 2016 09:39
Show Gist options
  • Save gotpop/e02659531eb42b8359b6227cf195c27b to your computer and use it in GitHub Desktop.
Save gotpop/e02659531eb42b8359b6227cf195c27b to your computer and use it in GitHub Desktop.

##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>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment