1. مشكلة عدد صف الجدول
نظرًا لأنك تريد عرض جدول التاريخ ، يجب أولاً معرفة عدد الصفوف والأعمدة الموجودة في هذا الجدول. تم تحديد عدد الأعمدة ، مع ما مجموعه 7 أعمدة من الأحد (العمود الأول في التقويم هو الأحد) إلى السبت. قبل حل مشكلة عدد الصفوف ، يجب أولاً معرفة ما هو اليوم الأول من الشهر ، لأن اليوم الأول من كل شهر لا يبدأ من أيام الأحد في التقويم. قد يكون يوم الجمعة والسبت ، لذلك يجب استبدال الجزء الأيسر من الأول بجدول فارغ. إذن كم عدد الجداول الفارغة التي يجب استخدامها بدلاً من ذلك؟ يجب علينا هنا استخدام طريقة getDay () ، التي تُرجع رقمًا في المصفوفة [0-6] ، ويمثل 0 يوم الأحد ، ويمثل 1 الاثنين ، ويمثل 2 الثلاثاء ، وهكذا. لذلك إذا كان الأول من الشهر هو يوم الجمعة ، فستكون هناك حاجة إلى 5 نماذج فارغة لاستبدالها على اليسار. ثم ، إذا كان هناك 31 يومًا في الشهر ، فإن العدد الأخير من الصفوف يمكن العثور عليه هو:
var tr_nums = math.ceil ((5 + 31)/7) ؛
بالطبع ، ليس كل شهر 31 يومًا ، لذلك يتعين علينا إنشاء مجموعة من 12 شهرًا ، ويمثل كل عنصر عدد الأيام كل شهر. ومع ذلك ، فبراير مميز جدا. هناك 29 يومًا في فبراير في سنة قفزة و 28 يومًا فقط في فبراير في عام عادي. لذلك ، قبل إنشاء صفيف ، يجب عليك إنشاء وظيفة تقفز من قبل نفسك:
// إذا كان من الممكن تقسيم السنة الحالية بمقدار 4 ولكن لا يمكن تقسيمها على 100 أو يمكن تقسيمها على 400 ، فيمكن تحديدها على أنها سنة قفزة ، أو العائد 1 ، وإلا فإن وظيفة isLeap (السنة) {return year 4 == 0؟ (السنة 100! = 0؟ 1: (السنة ٪ 400 == 0؟ 1: 0)): 0 ؛ }ثم نقوم بإنشاء مجموعة من أشهر:
var days_per_month = صفيف جديد (31 ، 28 + isLeap (سنة) ، 31 ، 30 ، 31 ، 30 ، 31 ، 31 ، 30 ، 31 ، 31 ، 30 ، 31) ؛ هذا يضمن أن يتم إخراج العدد الصحيح من الأيام في كل من السنوات العادية والقفز. يتم استخدام الرمز التالي للحصول على معلومات ذات صلة حول اليوم: var اليوم = تاريخ جديد () ، // احصل على التاريخ الحالي y = اليوم. تسليط الضوء على اليوم عند إنشاء جدول التاريخ) First Way = New Date (Y ، M ، 1) ، // احصل على اليوم الأول من الشهر في اليوم الواسع = FirstDay.getDay () ، // ugne the Day of the Week (Return One in [0-6] ، 0 ، 3 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 30 ، 31 ، 30 ، 31 ، 31 ، 30 ، 31 ، 30 ، 31 ، 30 ، 31 ، 31 ، 30 ، 31 ، 30 ، 31 ، 30 ، 31) ، // إنشاء صفيف الشهر
لذلك في النهاية ، يمكنك الحصول على عدد صفوف الجدول المطلوبة لهذا الشهر:
var str_nums = math.ceil ((dayofweek + days_per_month [m]) / 7) ؛ // تحديد عدد الصفوف المطلوبة لجدول التاريخ
2. طباعة جدول التقويم
الجدول نفسه عبارة عن صفيف ثنائي الأبعاد ، لذا دع الماجستير يخرج ويدير حلقتين لإكماله. الرمز كما يلي:
لـ (i = 0 ؛ i <str_nums ؛ i += 1) {// الطبقة الأولى للحلقة تنشئ علامة tr tran.write ('<tr>') ؛ لـ (k = 0 ؛ k <7 ؛ k ++) {// الطبقة الثانية للحلقة تنشئ علامة td var idx = 7 * i+k ؛ // إنشاء فهرس لكل جدول ، بدءًا من 0 var date = idx - dayofweek + 1 ؛ // تطابق الأول من الشهر مع الأسبوع // افعل شيئًا آخر} document.write ('</tr>') ؛ }3. قم بإرفاق رمز تقويم JS الكامل
<script> // judge ما إذا كانت السنة الحالية هي سنة قفزة (هناك 29 يومًا في فبراير من السنة القفزة و 28 يومًا فقط في فبراير من السنة العادية) وظيفة IsLeap (السنة) {Return Year 4 == 0؟ (السنة 100! = 0؟ 1: (السنة ٪ 400 == 0؟ 1: 0)): 0 ؛ } var i ، k ، today = new date () ، // احصل على التاريخ الحالي y = اليوم. جدول التاريخ) FirstDay = تاريخ جديد (Y ، M ، 1) ، // احصل على اليوم الأول من الشهر في اليوم الواسع = FirstDay.getDay () ، // ugne the Day of the Week (العودة واحدة في [0-6] ، 0 يمثل الأحد ، 1 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 31 ، 30 ، 31 ، 30 ، 31 ، 31 ، 30 ، 31 ، 30 ، 31) ، // إنشاء صفيف الشهر str_nums = math.ceil ((dayofweek + days_per_month [m]) /7) ؛ // حدد عدد الصفوف المطلوبة لمستند جدول التاريخ. write ("<table cellpacing = '0'> <tr> <th> اليوم </th> <th> اثنان </th> <th> اثنان </th> <th> أربعة </th> </th> Six </th> </tr>") ؛ // قم بطباعة الصف الأول من الجدول (عرض الأسبوع) لـ (i = 0 ؛ i <str_nums ؛ i += 1) {// إنشاء مستند جدول تاريخ ('<tr>') ؛ لـ (k = 0 ؛ k <7 ؛ k ++) {var idx = 7 * i+k ؛ // إنشاء فهرس لكل جدول ، بدءًا من 0 var date = idx - dayofweek + 1 ؛ // تطابق الأول من الشهر مع الأسبوع (التاريخ <= 0 || Date> days_per_month [m])؟ Date = '': Date = idx - DayOfWeek + 1 ؛ // الفهرس أقل من أو يساوي 0 أو أكبر من الحد الأقصى لقيمة الشهر ، استخدم جدولًا فارغًا بدلاً من التاريخ == D؟ document.write ('<td>' + date + '</td>'): document.write ('<td>' + date + '</td>') ؛ // تمييز اليوم} document.write ('</tr>') ؛ } document.write ('</table>') ؛ </script>دعنا نلعب بحرية في جزء CSS. الوقت الحالي هو 2 مايو 2016 ، والأداءات على النحو التالي:
ما سبق هو كل شيء عن هذا المقال ، آمل أن يكون من المفيد للجميع تعلم برمجة JavaScript.