ホームページ > ウェブフロントエンド > jsチュートリアル > 日付関数と関数のカプセル化の柔軟な使用

日付関数と関数のカプセル化の柔軟な使用

零下一度
リリース: 2017-06-26 11:48:17
オリジナル
1663 人が閲覧しました





Title
td {
text-align: center;
}


& lt;select id="yearSelect">< /select>














二 th>

<script><br> /*<br> * 获取指定年月份の日期总天数<br> * 显示的月份的第一天は星期几?<br> * */</p> <p>var yearSelectElement = document.querySelector('#yearSelect');<br> var monthSelectElement = document.querySelector('#monthSelect');<br> var tbody = document.querySelector('tbody' );<br> var StrongElement = document.querySelector('strong');</p> <p>var nowDate = new Date();</p> <p>/*<br> * アニメーション生成オプション<br> * */<br> var html = '';<br> for (var i =1970年;私は if (i == nowDate.getFull Year()) {<br> html = '<選択されたオプション>'+ i +'</option>' + html;<br> } else {<br> html = '<option>'+ i +'</option>' + html;<br> }</p> <p>}<br> yearSelectElement.innerHTML = html;</p> <p>var html = '';<br> for (var i=0; i<12; i++) {<br/> if (i == nowDate.getMonth()) {<br/> html += '<option value="'+i+'" selected>'+ (i+1) +'</option>';<br> } else {<br> html += '<option value=" '+i+'">'+ (i+1) +'</option>';<br> }</p> <p>}<br> monthSelectElement.innerHTML = html;</p> <p>/*<br> * 默认显示当為和月的日历<br> * */<br> calendar(nowDate.getFull Year(), nowDate.getMonth());</p> <p>/*<br> * 根据选择的年和月重新生成日历<br> * */<br> yearSelectElement.onchange = monthSelectElement.onchange = function() {<br> calendar(yearSelectElement.value, monthSelectElement.value);<br> };</p> <p>function Calendar(年, 月) {<br> year = Number(年);<br> month = Number(月);<br> strongElement.innerHTML = year + '年' + (月+1) + '月';</p> <p>var html = '<tr>';<br> for (var i=1; i<=42; i++) {</p><p>if (i%7 == 1 && i != 1) {<br/> html += '</tr><tr>';<br> }</p> <p>var v = i- getFirstDay(年, 月);</p> <p>if (v < 1 || v > getDays(年, 月)) {<br> html += '<td> </td>';<br> } else {<br> if (i % 7 == 1 || i % 7 == 0) {<br> html += '<td style="color: red">'+ v +'</td>';<br> } else if (<br>年 == 現在の日付.getFullyear()<br> &&<br> month == nowDate.getMonth()<br> &&<br> v == 今Date.getDate()<br> ) {<br> html += '<td style="background: red; color:white;"&gt ;'+ v +'</td>';<br> } else {<br> html += '<td>'+ v +'</td>';<br> }<br> }</p> <p><br> }<br> html += '</tr>';<br> tbody.innerHTML = html;<br> }</p> <p>/*<br> * 获取指定显示年月份的日期总天数<br> * */<br> function getDays(y, m) {<br>新しい日付を返します( y, m+1, 1, -1, 0, 0).getDate();</p> <p>/*<br> * 次の一月の 1 日、-1 時 0 分 0 秒の日期<br> * -1 : 其实就是前一天、表示就は上月の最終一天の 23 時<br> * */<br> var date = new Date(y, m+1, 1, -1, 0, 0);<br> /*<br> * 上一月最終一天的日期其实就是上个月总的天数<br> * */<br> return date.getDate();<br> }</p> <p>/*<br> * 获取指定显示的年月份の第一天是期几<br> * */ <br> 機能getFirstDay(y, m) {<br> return new Date(y, m, 1).getDay();<br> }<br></script>

以上が日付関数と関数のカプセル化の柔軟な使用の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート