Введение в jquery ajax
В этом уроке мы начнем рассматривать ajax в контексте библиотеки jquery. Будут рассмотрены пять основных функций, большинство из которых являются частными случаями метода ajax, который мы рассмотрим на следующем уроке.
Кратко о рассматриваемых функциях:
- jQuery.get (https://api.jquery.com/jquery.get/) — метод выполняет запрос HTTP методом GET.
- jQuery.post (https://api.jquery.com/jquery.post/) — метод выполняет запрос HTTP методом POST.
- jQuery.getJSON (https://api.jquery.com/jquery.getJSON/) — загружает JSON данные с сервера методом GET
- jQuery.parseJSON (https://api.jquery.com/jquery.parseJSON/) — получает JSON строку и возвращет javascript значение (string/number/object/boolean). Если вы используете jquery версии 3, то будьте внимательны — данный метод объявлен устаревшим, начиная с этой версии библиотеки
- jQuery.parseXML (https://api.jquery.com/jquery.parseXML/) — разбирает xml строку и возвращает xml документ
Код урока (HTML)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="get"></div>
<div id="post"></div>
<script src="jquery.min.js"></script>
<script>
// jQuery.get() - https://api.jquery.com/jquery.get/
// jQuery.post() - https://api.jquery.com/jquery.post/
// jQuery.getJSON() - https://api.jquery.com/jquery.getJSON/
// jQuery.parseJSON() - https://api.jquery.com/jquery.parseJSON/
// jQuery.parseXML() - https://api.jquery.com/jQuery.parseXML/
var name = "Камиль";
var city = "Москва";
$.get("get.php", {name: name, city: city}, function(data){
$("#get").html(data);
}, 'json');
$.post('post.php', {player: "Неймар", team: "ПСЖ"}, function(data){
$("#post").html(data);
});
$.getJSON('file.json', function(data){
console.log(data);
});
var json = $.parseJSON('{"city": "Moscow","country": "Russia"}');
console.log(json);
var xml = $.parseXML('<?xml version="1.0" encoding="UTF-8"?><pupils><pupil><firstName>Иван</firstName><lastName>Иванов</lastName></pupil></pupils>');
console.log(xml);
</script>
</body>
</html>
Код урока (get.php)
<?php
$name = $_GET['name'];
$city = $_GET['city'];
$user['name'] = $name;
$user['city'] = $city;
echo json_encode($user);
Код урока (post.php)
<?php
$player = $_POST['player'];
$name = $_POST['team'];
echo $player . " " . $name;
Код урока (file.json)
{
"city": "Moscow",
"country": "Russia",
"phoneCode": "(495), (499)"
}
0 Комментариев