Оновлення вмісту веб-сторінки без перезавантаження за допомогою javascript

. створимо його на сторінці і дамо йому унікальний ідентифікатор, за яким його дізнається jQuery.

Важливо розуміти, що ідентифікатор повинен бути унікальним на всій сторінці, тому викликом $ ( '# block') ми отримаємо перший елемент на сторінці з таким id. Якщо потрібно змінити вміст кількох елементів, варто використовувати класи.

return false; після виклику потрібен для того, щоб скасувати перехід по url з href. в нашому випадку ми не повернемося вгору сторінки, а залишимося на місці.

Тепер розглянемо саму функцію на JS, змінювати вміст блоку будемо з допомогою методу .html (). Якщо використовувати його без аргументів, то він поверне нам поточний зміст блоку, якщо передати йому один аргумент, наприклад рядок, то він замінити вміст блоку на неї. У більш наближених до реальності випадках, методу передається функція, яка відпрацьовує для блоку і повертає йому новий вміст. Але поки ми обмежимося передачею рядка.

Ось як буде виглядати код веб-сторінки.

Приклад передачі функції в метод .html ()

Я придумав зовсім простеньку функцію, яка буде накопичувати нашу історію натискань на кнопки, і очищати її, коли ми захочемо. Для демонстрації цілком достатньо.

висновок

Ну ось і все, якщо розібратися, то нічого складного, але за допомогою цього методу можна вершити «великі справи» і створювати динамічні веб-сторінки на будь-який смак. Дякую за увагу!