Блог

Итак, у меня есть некоторые элементы, которые необходимо динамически заполнять этими месяцами. Прямо сейчас процесс повторяется один раз. Есть ли способ, которым я могу изменить его, чтобы он продолжал перебирать этот массив, пока не закончатся элементы «.point» в html?

JS

 var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
var monthsLength = months.length;
var points = $('.point');
for (var i = 0; i < monthsLength; i  ) {
    var point = points[i];
    if (!point) {
        break;
    }
    point.setAttribute("data-date", months[i]);
}
 

Согласно синтаксису вашего кода, я предполагаю, что вы используете jQuery.

Если количество элементов меньше или равно 12, вы можете просто переместить элемент из массива месяцев для каждой точки.

 $('.point').each(function() {
    $(this).attr("data-date", months.shift());  
});
 

Если точек больше 12, то было бы лучше получить соответствующий месяц, используя операцию mod division для индекса массива. Используя этот способ, вы можете перебирать массив месяцев столько, сколько необходимо.

PS: Вы можете просмотреть элементы в окне вывода, используя инструмент разработчика браузера, чтобы увидеть результаты.

 var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];

$('.point').each(function(index, value) {
    $(this).attr("data-date", months[index % 12]);  
}); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class='point'></div>
<div class='point'></div>
<div class='point'></div>
<div class='point'></div> 

Я думаю, что .функция filter() лучше подходит для этого over .map() . Вы можете указать желаемую «точку», и она будет возвращать только элементы с ней. Затем вы можете использовать эти точечные данные по своему усмотрению.