Как вывести числа календаря в таблице?

Question

[Uber Noob]

На JS собрал все данные, осталось только отрисовать финальную таблицу с календарём. Не могу понять как пропустить первые 3 ячейки таблицы в первой строке если месяц начинается с четверга и разместить первое число именно с 4 ячейки а после 7й сделать "перенос строки". Реализации посмотрел разные, например:

do {
    // Начало строки таблицы
    if (index%7==0) {
      tmp+='<tr>';
    }
    // Пустые ячейки до начала месяца или после окончания
    if ((index<start_day) || (index>=(total_days+start_day))) {
      tmp+='<td class="grayed">&nbsp;<\/td>';
    }

или

for (c=8;c<43;c++)
if (td_d[c].innerHTML==0) {
   td_d[c].visibility="hidden"; // не показывать ячейку, если она пустая
} else td_d[c].bgColor="white"; // непустые ячейки окрасить белым цветом

Но чё-то как-то не доходит до меня алгоритм всё равно.

Answer 1

[Алексей]

Попробуйте проще.
У вас есть массив из 31 элемента, вы знаете что месяц начинается с четверга.
Добавьте в начале массива 3 пустых элемента и выводите по простой схеме как будто месяц начинается с понедельника.

Comments

[Uber Noob]

Да, отличная мысль, спасибо! А как определить числа которые находятся под СБ и ВС (в этих столбцах) и сделать их красными (выходные)?

[Алексей]

Зависит от того как будете выводить.
Если двумя циклами - строки, столбцы, то по номеру столбца (или строки, смотря как вы его выводите).

[Алексей]

Если просто по номеру элемента, то что-то типа (i+1) % 7 == 0 - это ВС, (i+2) % 7 == 0 - это СБ.

Answer 2

[Петр]

var crm = dt.getMonth();
var sdt = new Date(dt.getFullYear(), crm, 1, 9, 1, 1);
var day = sdt.getDay();
if (day != 1) sdt.setDate((day == 0) ? -5 : -(day - 2));
var cl = 0, tr = null, td, nmn,
secoffs = 24 * 60 * 60 * 1000,
vof = sdt.valueOf();
for (var i = 0; i < 42; i++){
   if (!cl){
      tr = pr._crEl('tr');
      pr._addChild(bd, tr);
   }
   var ndt = new Date(vof + (secoffs * i));
   td = pr._crEl('td');
   pr._addChild(tr, td);
   td.innerText = ndt.getDate();
   nmn = ndt.getMonth();
   if (nmn != crm) pr._setAttrs(td, { "class": "wch-cal-ncm", 'data-month': nmn, 'data-year': ndt.getFullYear() });
   if (++cl > 6) cl = 0;
}

Comments

[Uber Noob]

Это прекрасно, но я хотел бы понять, а не найти готовое решение )

[Петр]

ubernoob: getDay() - возращает день недели для первого дня месяца. Это и будет смещение.

[igorch96]

А за такой код в нормальных конторах руки отрывают... Он абсолютно нечитабелен.

[Uber Noob]

Петр: А почему цикл до 42 идёт?

[Петр]

igorch96: Мне в личных проектах не нужна читабельность кода и комментарии. Я свой код читаю с легкостью и через много лет.

[Петр]

ubernoob: Есть месяца в которых месяц занимает 6 недель

[Uber Noob]

Петр: А потом из личных проектов вы потащите код с такой читабельностью в рабочие...

[Петр]

ubernoob: Это ваш личный подход?

[igorch96]

Петр: Ну Вы же только, что рекоммендовали этот код человеку и он наверняка вставит его в продакшен. И кому-то другому придется его поддерживать. Думаю, это не прибавит баллов проекту.

[Uber Noob]

igorch96: Я не могу вставить этот код в проект хотя бы потому что что мне он не понятен )) Я вставляю только то в чём хотя бы сам разобрался

[Петр]

ubernoob: Именно. Большинство поступают также.

[Петр]

igorch96: Умные люди не занимаются бездумным копипастингом.

[igorch96]

Петр: Но и не тратят время на разбор и приведение в порядок приведенного кода. А есть места, где за такое увольняют. Сам видел.

[igorch96]

Петр: И опять же, я нисколько не хотел очернить Вашу работу. Я просто рекомендую улучшить стиль программирования до того, как станет поздно и Вы что-то потеряете из-за этого.

[Петр]

igorch96: Который? ))) Для личных проектов с экономией на трафике, для коммерческих, который вы даже и не видели. Для C#, java, javascript, C++, python? Рекомендовать хоть что-то стоит тогда когда вы хоть что-то знаете о человеке.