2016-12-19 6 views
1

純粋なJavascriptでリストを作成するにはどうすればよいでしょうか?メール・カレンダーで「ウィーク」 - 表示と同様カレンダー、週のリストを週単位で区切って

は、これが最終的な出力にする必要があります

<ul> 
    ... 
    <li id="currrentWeek" data-week-nr="51"> 
    <div class="today" data-day="1" data-dayOfMonth="19">monday</div> 
    <div data-day="2" data-dayOfMonth="20">tuesday</div> 
    <div data-day="3" data-dayOfMonth="21">wednesday</div> 
    <div data-day="4" data-dayOfMonth="22">thursday</div> 
    <div data-day="5" data-dayOfMonth="23">friday</div> 
    <div data-day="6" data-dayOfMonth="24">saturday</div> 
    <div data-day="0" data-dayOfMonth="25">sunday</div> 
    </li> 
    <li id="nextWeek" data-week-nr="52"> 
    <div data-day="1" data-dayOfMonth="26">monday</div> 
    <div data-day="2" data-dayOfMonth="27">tuesday</div> 
    <div data-day="3" data-dayOfMonth="28">wednesday</div> 
    <div data-day="4" data-dayOfMonth="29">thursday</div> 
    <div data-day="5" data-dayOfMonth="30">friday</div> 
    <div data-day="6" data-dayOfMonth="31">saturday</div> 
    <div data-day="0" data-dayOfMonth="01">sunday</div> 
    </li> 
    ... 
</ul> 

+0

私はあなたがそれをするのを助けるためにmoment.jsを使用することができると思います:http://momentjs.com/ –

+0

ああ、私はちょうどこの先週のために(わずかに)醜いコードを書くために起こった、私はそれを一般化します。 –

答えて

0

は涼しいああ、私はちょうどこの最後のために(少し)醜いコードを書くことが起こっありがとう週:

// let's start with a function that gives us all weeks in a range 
function* weeks(from, to = new Date()) { 
    for (var f = from.getTime(); f <= to; f += 1000 * 60 * 60 * 24 * 7) { 
    let d = new Date(f); 
    while (d.getDay() === 0 || d.getDay() === 6) { 
     d = new Date(d.getTime() + 1000 * 60 * 60 * 24); 
    } 
    yield d; 
    } 
} 

最も早い日付を見つけヘルパー:

function earliestDate(dates) { 
     return dates.sort((x, y) => y - x).pop(); 
} 

さて、あなたは配列としてそれを取り戻すためにArray.fromを使用することができ週間

function* groupByWeek(dates) { 
    for(const week of weeks(earliestDate(dates))) { 
    const fromWeek = dates.filter(x => x < week); 
    dates = dates.filter(x => !fromWeek.includes(x)); 
    yield dates; 
    } 
} 

の一定の範囲内にあるその日チェックしてみましょう。

関連する問題