What is AJAX?
AJAX = Asynchronous JavaScript and XML.
AJAX is a technique for creating fast and dynamic web pages.
AJAX allows web pages to be updated asynchronously by exchanging small amounts of data with the server behind the scenes. This means that it is possible to update parts of a web page, without reloading the whole page.
AJAX is a technique for creating fast and dynamic web pages.
AJAX allows web pages to be updated asynchronously by exchanging small amounts of data with the server behind the scenes. This means that it is possible to update parts of a web page, without reloading the whole page.
You can learn more about AJAX in our AJAX tutorial.
AJAX and jQuery
jQuery provides a rich set of methods for AJAX web development.
With jQuery AJAX, you can request TXT, HTML, XML or JSON data from a remote server using both HTTP Get and HTTP Post.
And you can load remote data directly into selected HTML elements of your web page!
Write Less, Do More
The jQuery load() method is a simple (but very powerful) AJAX function. It has the following syntax:
$(selector).load(url,data,callback)
Use the selector to define the HTML element(s) to change, and the url parameter to specify a web address for your data.
jQuery AJAX Methods From This Page:
Request | Description |
---|---|
$(selector).load(url,data,callback) | Load remote data into selected elements |
$.ajax(options) | Load remote data into an XMLHttpRequest object |
<html>
<head>
<script type="text/javascript"
src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("div").load('test1.txt');
});
});
</script>
</head>
<body>
<div><h2>Let AJAX
change this text</h2></div>
<button>Change Content</button>
</body>
</html>
<html>
<head>
<script type="text/javascript"
src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$.ajax({url:"test1.txt", success:function(result){
$("div").html(result);
}});
});});
</script>
</head>
<body>
<div><h2>Let AJAX
change this text</h2></div>
<button>Change Content</button>
</body>
</html>
|
No comments:
Post a Comment