Интеграционное тестирование

Cash — это лёгкая альтернатива jQuery с современным синтаксисом, предназначенная для упрощения работы с DOM, событиями и AJAX. Она сохраняет знакомый стиль выборки элементов и методов работы с ними, при этом минимизирует вес библиотеки и повышает производительность.

Подключение Cash

Cash может быть подключен как через CDN, так и через менеджеры пакетов:

<script src="https://cdn.jsdelivr.net/npm/cash-dom@8/dist/cash.min.js"></script>

Или через npm:

npm install cash-dom

В модульной системе можно импортировать:

import $ from 'cash-dom';

Выбор элементов

Cash использует знакомый CSS-селекторный синтаксис:

const items = $('.item'); // выбирает все элементы с классом item
const main = $('#main'); // выбирает элемент с id main

Метод возвращает объект Cash, который ведёт себя как массив элементов с расширенными методами для манипуляций.

Манипуляции с DOM

Добавление и удаление классов

$('.item').addClass('active');
$('.item').removeClass('inactive');
$('.item').toggleClass('highlighted');

Работа с атрибутами и свойствами

$('#link').attr('href', 'https://example.com'); 
const value = $('#input').val();
$('#input').val('Новое значение');

Изменение содержимого

$('.container').html('<p>Новый текст</p>');
$('.container').text('Простой текст');

Добавление и удаление элементов

$('<div class="new-item">Текст</div>').appendTo('.container');
$('.item:last').remove();

Работа с событиями

Cash поддерживает методы для подписки на события и их удаления.

Простое событие

$('.button').on('click', () => {
    console.log('Кнопка нажата');
});

Удаление события

const handler = () => console.log('Нажатие');
$('.button').on('click', handler);
$('.button').off('click', handler);

События с делегированием

$('.list').on('click', '.item', (e) => {
    console.log('Нажат элемент списка', e.target);
});

Анимации и эффекты

Cash реализует простые методы для анимаций:

$('.box').hide(); // скрывает элемент
$('.box').show(); // показывает элемент
$('.box').fadeIn(500); // плавное появление
$('.box').fadeOut(500); // плавное скрытие

Методы slideUp, slideDown также поддерживаются аналогично jQuery.

AJAX-запросы

Cash предоставляет удобные методы для работы с AJAX:

$.ajax({
    url: '/api/data',
    method: 'GET',
    dataType: 'json',
    success: function(response) {
        console.log('Данные получены', response);
    },
    error: function(err) {
        console.error('Ошибка запроса', err);
    }
});

Существуют сокращённые методы:

$.get('/api/data', function(response) {
    console.log(response);
});

$.post('/api/data', { key: 'value' }, function(response) {
    console.log(response);
});

Работа с цепочкой методов

Cash поддерживает метод chaining, что позволяет объединять несколько действий:

$('.item')
    .addClass('active')
    .text('Обновлённый текст')
    .fadeIn(300);

Совместимость и особенности

Cash ориентирован на современные браузеры и не поддерживает старые версии Internet Explorer. Библиотека минимизирована, что снижает вес страницы и ускоряет загрузку. Некоторые сложные плагины jQuery могут потребовать адаптации под Cash, но базовые методы идентичны.

Пользовательские плагины

Cash позволяет расширять функциональность с помощью пользовательских плагинов:

$.fn.extend({
    highlight: function(color = 'yellow') {
        return this.css('background-color', color);
    }
});

$('.item').highlight();

Расширение $.fn делает метод доступным для всех объектов Cash.

Итоговая структура работы

  • Выбор элементов через $()
  • Манипуляция классами, атрибутами, содержимым
  • Подписка на события и делегирование
  • Анимации и эффекты
  • AJAX-запросы и метод chaining
  • Расширение через плагины

Cash объединяет компактность и функциональность, позволяя создавать современные веб-приложения с минимальным количеством кода и высокой читаемостью.

Оглавление