AJAX Raw Or With jQuery Whats The Difference?

Scripts For AJAX Raw and AJAX with jQuery

First I will give you the AJAX raw script and the the AJAX with jQuery. You can compare the difference for yourself.

Make a file and call it index.php and insert the following code into the file.

[code]<html>
<head>
<title>Replace Text With Ajax</title>
</head>
<body>
<div id="display">
<h1>This text will be replaced</h1>
<button type="button" onclick="ajax_call()">Replace Text</button>
</div>
<script>
function ajax_call() {
var xhttp = new XMLHttpRequest();
var url = "ajax_text.txt";
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("display").innerHTML = this.responseText;
}
};
xhttp.open("GET", url, true);
xhttp.send();
}
</script>
</body>
</html>[/code]

Create file and call it text.txt and insert the following code.

Only cool people share!

[code]<h1>This is the replacement text with raw AJAX</h1>[/code]

After You Tried The Above Code

Now you can try it with jQuery and AJAX. Create a file or just replace the file you created called index.php and put the following code into it.

[code]<html>
<head>
<title>Replace Text With jQuery and Ajax</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<div id="display"><h2>jQuery will replace this text </h2></div>
<button>Replace Text</button>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#display").load("text.txt");
});
});
</script>
</body>
</html>[/code]

Now create or replace the text.txt file with the following code.

[code]<h1>This is the replacement text with jquery</h1>[/code]

AJAX Raw Or With jQuery Whats The Difference? was last modified: June 11th, 2017 by Maximus Mccullough