Этот сайт использует cookies. Продолжение работы с сайтом означает, что Вы согласны!
Изменение коллекции элементов
Библиотека jQuery позволяет не только получать коллекцию элементов, а затем манипулировать ими, но и изменять эту первоначальную коллекцию в любой момент времени. Множество методов предоставляют возможность добавления новых элементов, фильтрации элементов, а также передвижения по дереву DOM. Рассмотрим эти методы подробно.
Получение части коллекции
Следующие методы позволяют получить часть коллекции:
first()
— возвращает объект jQuery с первым элементом коллекции. Выделим первый абзац:
<p>Абзац 1</p>
<p>Абзац 2</p>
<p>Абзац 3</p>
$('p').first().css('color', 'red');
last()
— возвращает объект jQuery с последним элементом коллекции. Выделим последний абзац:
<p>Абзац 1</p>
<p>Абзац 2</p>
<p>Абзац 3</p>
$('p').last().css('color', 'red');
eq(<Индекс>)
— возвращает объект jQuery с элементом коллекции, имеющим указанный индекс. Если элемент не существует, то будет возвращен пустой объект jQuery, свойствоlength
которого равно нулю. Выделим второй абзац:
<p>Абзац 1</p>
<p>Абзац 2</p>
<p>Абзац 3</p>
$('p').eq(1).css('color', 'red');
Значение параметра метода eq()
может быть отрицательным. В этом случае отсчет производится с конца. Выделим последний абзац:
$('p').eq(-1).css('color', 'red');
even()
— возвращает объект jQuery с элементами коллекции, имеющими четные индексы. Метод доступен, начиная с версии jQuery 3.5.0. В этом примере будут выделены абзацы 1 и 3:
<p>Абзац 1</p>
<p>Абзац 2</p>
<p>Абзац 3</p>
<p>Абзац 4</p>
$('p').even().css('color', 'red');
odd()
— возвращает объект jQuery с элементами коллекции, имеющими нечетные индексы. Метод доступен, начиная с версии jQuery 3.5.0. В этом примере будут выделены абзацы 2 и 4:
<p>Абзац 1</p>
<p>Абзац 2</p>
<p>Абзац 3</p>
<p>Абзац 4</p>
$('p').odd().css('color', 'red');
slice()
— позволяет получить срез коллекции. Возвращает новую коллекцию элементов. Имеет следующий формат:
slice(<Начальная позиция>[, <Конечная позиция>])
Следует учитывать, что нумерация позиций начинается с нуля, а конечная позиция не попадает в диапазон возвращаемых значений. Выделим первый абзац в коллекции:
$('p').slice(0, 1).css('color', 'red');
А теперь выделим только второй и третий абзацы:
$('p').slice(1, 3).css('color', 'red');
Если второй параметр не указан, то будут возвращены элементы от начальной позиции до конца коллекции. Выделим все абзацы, начиная с третьего:
$('p').slice(2).css('color', 'red');
В случае указания отрицательного значения позиции будут отсчитываться с конца коллекции. Выделим два последних абзаца:
$('p').slice(-2).css('color', 'red');
Пронумеруем все абзацы в документе с помощью метода slice()
:
var elem = $('p');
for (var i = 0, count = elem.length; i < count; i++) {
elem.slice(i, i + 1).html('Абзац ' + i);
}
toArray()
— позволяет преобразовать коллекцию элементов jQuery в массив DOM-элементов. Во всех тегах<p>
выведем индекс текущего абзаца:
var arr = $('p').toArray();
for (var i = 0, count = arr.length; i < count; i++) {
arr[i].innerHTML = i;
}
Реквизиты
ЮMoney: 410011140483022
ПАО Сбербанк:
Счет: 40817810855006152256
Реквизиты банка:
Наименование: СЕВЕРО-ЗАПАДНЫЙ БАНК ПАО СБЕРБАНК
Корреспондентский счет: 30101810500000000653
БИК: 044030653
КПП: 784243001
ОКПО: 09171401
ОКОНХ: 96130
Скриншот реквизитов