С чего начать внедрение AJAX на свой сайт?

Question

[Евгений Фамилия]

Есть сайт построенный на php, javaScript и html. Хочу сделать так, чтобы при переходе на другую страницу прогружался только файл, содержащий только ту часть, которая меняется на текущей странице. Нужно сделать чтобы на сайте обновлялась только та часть, которую мне нужно обновить, а остальное было в одном файле и сохраняло свою работоспособность. Подскажите пожалуйста, что мне изучить чтобы я мог это организовать на языке AJAX, или какие ещё есть варианты.

Answer 1

[Дима Долготер]

AJAX это не язык. AJAX это часть jquery. можно обойтись встроенным fetch.
вот еще примеры

принцип простой

1. нажимаешь на кнопку "о нас"
   
2. все что в теге main удаляется и остается шапка и футер
   
3. идет запрос с data:contact (для примера)
   
4. если успех, то вставляется инфа в тег main
   
   

на сайте есть php?
советую сразу учить фреймворк, чтоб делать сразу как надо (лучше vue, для новичков лучше всего подойдет)

Comments

[Denis Melnikov]

На всякий, AJAX не часть JQ =)

[Дима Долготер]

Denis Melnikov, интересно) почему? веь работает с подключенной jquery?

[Denis Melnikov]

Дима Долготер, для начала, что такое JQ ? Это библиотека нативного JS, упрощающая работу с кодом.
Второе, что такое в целом AJAX - асинхронный JSON и XML, то есть, просто технология., в JS есть 2 инструмента ( которые я знаю ) , для работы с запросами , XMLHttpRequest и Feetch.
Ну а теперь , берем, нативный JS, нативные инструменты, делаем красивую библиотеку - JQ ...
и работаем а ля с одним методом и все считают что JQ = AJAX =)

Если еще проще, то встроенными инструментами, без JQ , все можно сделать.
JQ в целом надо бы забывать ...

Answer 2

[Стас Хитрич]

Ajax не язык, а часть функционала JavaScript.
Вообще, суть одна, у вас должен быть php файл обрабатывающий запросы к нему и отдающий сформированный html в виде строки и js скрипт который вставляет полученный ответ в нужное место на странице.
Вообще, это довольно плохо для seo и тут нужны определенные навыки для таких сайтов, но если просто учебы ради или вы хотите так сделать несмотря ни на что, то схему описал.
Вот пример простых аяксов и обработки

Answer 3

[nokimaro]

по быстрому внедрить ajax на работающий сайт
без jquery - https://github.com/MoOx/pjax
c jquery - https://github.com/defunkt/jquery-pjax

В общем случае нужно определить лишь селектор для контейнера(ов) и селектор для ссылок, чтобы перехватывать клики, и вместо обычного перехода делать ajax-запрос и затем замену контента без перезагрузки страницы.

SEO при использовании этих библиотек никак не страдает, так как остаётся полная обратная совместимость.

Answer 4

[BATPYIIIKOB]

Подскажите пожалуйста, что мне изучить чтобы я мог это организовать на языке AJAX...

AJAX - это не язык.
Изучить необходимо JS.