jQuery - Introduction to AJAX
What is AJAX?
AJAX = Asynchronous JavaScript and XML.
AJAX is a technology for creating fast, dynamic web pages.
By exchanging a small amount of data with the server in the background, AJAX can enable asynchronous updates of web pages. This means that parts of a web page can be updated without reloading the entire page.
For traditional web pages (not using AJAX), if the content needs to be updated, the entire web page must be reloaded.
There are many application cases using AJAX: Sina Weibo, Google Maps, Kaixin.com, etc.
About jQuery and AJAX
JQuery is a lightweight js library that is compatible with CSS3 and various browsers (IE 6.0+, FF1.5+, Safari 2.0 +, Opera 9.0+). jQuery enables users to more easily process HTML documents and events, implement animation effects, and easily provide AJAX interaction for websites.
With jQuery AJAX methods, you can request text, HTML, XML or JSON from a remote server using HTTP Get and HTTP Post - and you can load this external data directly into selected elements of the web page middle.
##Example:
Show one first Front-end code:<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(php.cn)</title>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
//按鈕單擊時執(zhí)行
$("#testAjax").click(function(){
//Ajax調用處理
var html = $.ajax({
type: "POST",
url: "text.php",
data: "name=garfield&age=18",
async: false
}).responseText;
$("#myDiv").html('<h2>'+html+'</h2>');
});
});
</script>
</head>
<body>
<div id="myDiv"><h2>通過 AJAX 改變文本</h2></div>
<button id="testAjax" type="button">Ajax改變內容</button>
</body>
</html> When displaying a piece of background php code, we named it text.php: <?php $msg='Hello,'.$_POST['name'].',your age is '.$_POST['age'].'!'; echo $msg; ?>In this way, we complete a simple JQuery Ajax call example.
