Работа функции с элементами набора

.map()

Выполняет заданную функцию для каждого из выбранных элементов в отдельности. Значения, полученные в результате выполнения этой функции образуют новый набор в виде объекта jQuery, именно его и возвращает метод map. map имеет один вариант использования:

.map(callback(index, domElement)):jQuery1.2

Выполняет функцию callback для каждого из выбранных элементов. В callback передаются 2 параметра: номер элемента в наборе и сам элемент (в виде объекта DOM).

Обычно, объект jQuery представляет группу элементов страницы, однако, метод map возвращает объект jQuery, включающий в себя величины любых типов javascript: объектов, строк, чисел, функций и.т.д. Применение стандартных методов к такому нестандартно укомплектованному объекту может вызвать ошибки выполнения, поэтому надежнее будет конвертировать его в массив, например с помощью метода .get().

В действии

Найдем классы всех div-элементов на странице:

var classes = $("div").map(function(indx, element){
  return $(element).attr("class");
});

в результате, переменной classes будет присвоен объект jQuery, содержащий список всех классов у div-элементов. Однако, поскольку объект jQuery плохо подходит для хранения чего-либо, кроме элементов страницы, правильнее будет конвертировать его в массив:

var arr = classes.get();


В следующем примере, найдем предков второго уровня у всех элементов с классом box (т.е. родителей их родителей):

var nonno = $(".box").map(function(indx, element){
  return $(element).parent().parent();
});

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

Ссылки

Поисковые ключи:
  • вызов функции для каждого элемента набора
  • выполнить функцию для каждого элемента набора
  • вызвать функцию для каждого элемента набора
  • обработка выбранных элементов
  • map()
  • .map()