1. Введение в ajax

ajax да Аббревиатура для асинхронного JavaScript и XML,ajax, технология взаимодействия внешнего и внутреннего интерфейса,он можетпозволять javascript Отправить асинхронно http Запрос, общение с фоном для получения данных,ajax самое большое преимуществодаРеализация частичного обновления,ajax может отправить HTTP-запрос,Когда фоновые данные получены, данные отображения страницы обновляются.,Здесь всем просто нужно помнить,Если текущая страница хочет взаимодействовать с внутренним сервером, вы можете использовать ajax.

Вот напоминание для всех, Использование ajax на html-странице требует запуска в среде веб-сервера. Обычно отправьте запрос ajax на свой веб-сервер.

2. Использование ajax

jquery инкапсулирует его в метод $.ajax(), мы можем напрямую использовать этот метод для выполнения ajax-запросов.

Пример кода:

<script>
    $.ajax({
    // 1.URL-адрес запроса
    url:'http://t.weather.sojson.com/api/weather/city/101010100',
    // 2.type Метод запроса, по умолчанию — «GET», обычно используется «POST».
    type:'GET',
    // 3.dataType Установите формат возвращаемых данных, обычно используемый формат json.
    dataType:'JSON',
    // 4.data Установите данные, отправляемые на сервер, Никакие параметры не должны быть установлены
​
    // 5.успех устанавливает функцию обратного вызова после успешного запроса
    success:function (response) {
        console.log(response);    
    },
    // 6.ошибка устанавливает функцию обратного вызова после сбоя запроса
    error:function () {
        alert("Запрос не выполнен, повторите попытку позже!");
    },
    // 7.async Установите, является ли да асинхронным. Значение по умолчанию «true» означает асинхронное. Обычно нет необходимости его писать.
    async:true
});
</script>

Описание параметров метода ajax:

1. URL-адрес запроса
2. type Метод запроса, по умолчанию — «GET», обычно используется «POST».
3. dataType Установите формат возвращаемых данных, обычно используемый формат json.
4. data устанавливает данные, отправляемые на сервер. Если параметров нет, настройки не требуются.
5. успех устанавливает функцию обратного вызова после успешного запроса
6. ошибка устанавливает функцию обратного вызова после сбоя запроса
7. async Установите, является ли да асинхронным. Значение по умолчанию «true» означает асинхронное. Обычно нет необходимости его писать.
8. Синхронные и асинхронные инструкции
   • Синхронизируйте один запрос ajax, прежде чем его сможет запросить другой.,Необходимо дождаться завершения предыдущего запроса ajax.,Например, синхронизация потоков.
   • Асинхронный вариант с несколькими ajax-запросами одновременно,Не нужно ждать завершения других запросов ajax., Как поток асинхронный.

аякс-аббревиатура:

$.ajax может быть сокращен до $.get или $.post в зависимости от метода запроса.

ajax-аббревиатура

 <script>
    $(function(){
        /*
         1. URL-адрес запроса
         2. data Установите данные, отправляемые на сервер, Никакие параметры не должны быть установлены
         3. успех устанавливает функцию обратного вызова после успешного запроса
         4. dataType Установите формат возвращаемых данных, обычно используемый формат json., Формат данных интеллектуального решения по умолчанию
        */ 
        $.get("http://t.weather.sojson.com/api/weather/city/101010100", function(dat,status){
            console.log(dat);
            console.log(status);
            alert(dat);
        }).error(function(){
            alert("Сбой в сети");
        });

        /*
         1. URL-адрес запроса
         2. data Установите данные, отправляемые на сервер, Никакие параметры не должны быть установлены
         3. успех устанавливает функцию обратного вызова после успешного запроса
         4. dataType Установите формат возвращаемых данных, обычно используемый формат json., Формат данных интеллектуального решения по умолчанию
        */ 
        $.post("test.php", {"func": "getNameAndTime"}, function(data){
            alert(data.name); 
            console.log(data.time); 
        }, "json").error(function(){
            alert("Сбой в сети");
        }); 
    });


</script>

Описание параметров методов $.get и $.post:

$.get(url,data,success(data, status, xhr),dataType).error(func) $.post(url,data,success(data, status, xhr),dataType).error(func)

1. URL-адрес запроса
2. data устанавливает данные, отправляемые на сервер. Если параметров нет, настройки не требуются.
3. успех устанавливает функцию обратного вызова после успешного запроса
   • данные результата запроса данных
   • status запрошенная информация о состоянии, например: "success"
   • xhr Нижний уровень отправляет объект http-запроса XMLHttpRequest.
4. dataType устанавливает формат возвращаемых данных
   • "xml"
   • "html"
   • "text"
   • "json"
5. error Указывает обработку исключений ошибок
   • func Функция обратного вызова исключения ошибки

3. Резюме

• Ajax да Технология отправки http-запросов для получения фоновых данных сервера
• Сокращенный способ ajax можно реализовать с помощью методов $.get и $.post.