У меня есть загрузка div с классом testimonial
, и я хочу использовать jquery для их прокрутки для проверки каждого div, если конкретное условие истинно. Если это правда, он должен выполнить действие.
Кто-нибудь знает, как я это сделаю?
У меня есть загрузка div с классом testimonial
, и я хочу использовать jquery для их прокрутки для проверки каждого div, если конкретное условие истинно. Если это правда, он должен выполнить действие.
Кто-нибудь знает, как я это сделаю?
Использовать каждый: 'i
' является положением в массиве, obj
является объектом DOM, который вы выполняете итерации (к нему можно получить доступ через оболочку jQuery $(this)
).
$('.testimonial').each(function(i, obj) {
//test
});
Обратитесь к ссылка api для получения дополнительной информации.
попробуйте это...
$('.testimonial').each(function(){
//if statement here
// use $(this) to reference the current div in the loop
//you can try something like...
if(condition){
}
});
Это довольно просто сделать без jQuery в наши дни.
Просто выберите элементы и используйте метод .forEach()
, чтобы перебрать их:
var testimonials = document.querySelectorAll('.testimonial');
Array.prototype.forEach.call(testimonials, function(elements, index) {
// conditional here.. access elements
});
Попробуйте этот пример
Html
<div class="testimonial" data-index="1">
Testimonial 1
</div>
<div class="testimonial" data-index="2">
Testimonial 2
</div>
<div class="testimonial" data-index="3">
Testimonial 3
</div>
<div class="testimonial" data-index="4">
Testimonial 4
</div>
<div class="testimonial" data-index="5">
Testimonial 5
</div>
Если мы хотим получить доступ к тем divs
, у которых data-index
больше, чем 2
, тогда нам нужен этот jquery.
$('div[class="testimonial"]').each(function(index,item){
if(parseInt($(item).data('index'))>2){
$(item).html('Testimonial '+(index+1)+' by each loop');
}
});
вы можете сделать это таким образом
$('.testimonial').each(function(index, obj){
//you can use this to access the current item
});
divs = $('.testimonial')
for(ind in divs){
div = divs[ind];
//do whatever you want
}
jQuery.eq() может помочь вам пройти через элементы с индексированным подходом.
var testimonialElements = $(".testimonial");
for(var i=0; i<testimonialElements.length; i++){
var element = testimonialElements.eq(i);
//do something with element
}
Вы можете сделать это кратко, используя .filter
. В следующем примере будут скрыты все .testimonial divs, содержащие слово "something":
$(".testimonial").filter(function() {
return $(this).text().toLowerCase().indexOf("something") !== -1;
}).hide();
С помощью простого цикла:
var testimonials= $('.testimonial');
for (var i = 0; i < testimonials.length; i++) {
// Using $() to re-wrap the element.
$(testimonials[i]).text('a');
}
Я могу пропустить часть вопроса, но я верю, что вы можете просто сделать это:
$('.testimonial').each((index, element) => {
if (/* Condition */) {
// Do Something
}
});
Это использует jQuery каждый метод: https://learn.jquery.com/using-jquery-core/iterating/
Без обновления jQuery
document.querySelectorAll('.testimonial').forEach(function (element, index) {
element.innerHTML = 'Testimonial ' + (index + 1);
});
<div class="testimonial"></div>
<div class="testimonial"></div>
$('.testimonal').each(function(i,v){
if (condition) {
doSomething();
}
});
Более точно:
$.each($('.testimonal'), function(index, value) {
console.log(index + ':' + value);
});
В JavaScript ES6 .forEach() для массива-подобной коллекции NodeList, предоставленной Element.querySelectorAll()
document.querySelectorAll('.testimonial').forEach( el => {
el.style.color = 'red';
console.log( 'Element ${el.tagName} with ID #${el.id} says: ${el.textContent}' );
});
<p class="testimonial" id="1">This is some text</p>
<div class="testimonial" id="2">Lorem ipsum</div>
Попробуй это:
var boxes = $('.testimonial')
for(var i = 0; i < boxes.length; i++){
var box = boxes[i];
}
Вы можете использовать метод jQuery $ each для циклического прохождения всех элементов со свидетельством класса. i => - это индекс элемента в коллекции, а val дает вам объект этого конкретного элемента, и вы можете использовать "val" для дальнейшего доступа к свойствам вашего элемента и проверки вашего состояния.
$.each($('.testimonal'), function(i, val) {
if(your condition){
//your action
}
});