Метод filter не работает с Html элементами

214
11 января 2022, 08:20

// Этот код работает 
let elements = $('.item'); 
console.log(elements); 
 
let newElements = elements.filter(function() { 
	return $(this).attr('class') === 'item third'; 
}); 
console.log(newElements); 
 
 
 
 
// Этот код не работает 
let elements = $('.item'); 
console.log(elements); 
 
let newElements = elements.filter(function(item) { 
	return item.attr('class') === 'item third'; 
}); 
console.log(newElements);
<ul class="list"> 
  <li class="item">1</li> 
  <li class="item">2</li> 
  <li class="item third">3</li> 
  <li class="item">4</li> 
  <li class="item">5</li> 
</ul>

Почему при обращении к массиву элементов с помощью динамически созданной переменной "item" внутри метода "filter", не работает метод "attr" для этой переменной "item"?

Answer 1

Исходя из документации return item.attr('class') === 'item third'; не работает из за того что первый аргумент callback item является индексом, а не элементом.

Вам нужно или так:

var elements = jQuery(".item"),
newElements = elements.filter(function(index, element) {
    return element.className == "item third";
});
console.log(newElements);

Или так что ещё лучше:

var elements = jQuery(".item"), 
    newElements = elements.filter(".third");
console.log(newElements);

A так как this у callback является текущим элементом в итерации (или рекурсии), сравнение $(this).attr('class') === 'item third'; и работает.

READ ALSO
Как получить значения всех select в php массив?
javascript

Как получить значения всех select в php массив?

Есть страничка с select и кнока addНапример мне нужен три продукта и я нажав кнопку получил три select поля

 224
Ошибка eslint при экспорте модуля
javascript

Ошибка eslint при экспорте модуля

Недавно начал использовать готовый сборщик gulp-sass-starterСтолкнулся с такой проблемой, что не могу экспортировать модули

 227
Переключение радио кнопок по нажатию на обычные кнопки
javascript

Переключение радио кнопок по нажатию на обычные кнопки

столкнулся с проблемойКак сделать, чтобы при нажатии на обычные кнопки можно было переключать радио кнопки

 332
SyntaxError: expected expression, got &#39;&lt;&#39;
javascript

SyntaxError: expected expression, got '<'

Учусь писать ajax код через js, после нескольких монипуляций выползла следующия ошибка - SyntaxError: expected expression, got '<'; В ошибке показывает html файл...

 227