Q&A
> 書き方がわからなったので、あまり試せてません。
「HTMLレベルでの書き方」と「それをJavaScriptで実装する方法」の、どちらがわからない状況でしょうか？
実現したいこと
JavaScriptの配列を使用して作成したカレンダーの土曜日と日曜日に色を付けたい
配列の中身に色を付けたい
前提
JavaScriptでカレンダーを作成しています。
曜日を配列を使用して取り込んでいるのですが、どのようにcssにかきこみ色を付ければいいのかわかりません。
発生している問題・エラーメッセージ
以下main.js
"use strict"
var date =new Date();
var year=date.getFullYear();
var month=date.getMonth()+1;
var firstDate=new Date(year,month-1,1)
var firstDay=firstDate.getDay();
var lastDate= new Date(year,month,0);
var lastDayCount=lastDate.getDate();
var dayCount=1;
var createHtml='';
createHtml='<h1>'+year+'/'+month+'</h1>';
createHtml +='<table>'+'<tr>';
const weeks=['日','月','火','水','木','金','土'];
for(var i=0; i<weeks.length; i++){
createHtml += '<td>'+weeks[i]+'</td>';
}
createHtml +='</tr>';
for(var n =0;n<6;n++){
createHtml +='<tr>';
for(var d=0;d<7;d++){
if(n===0 && d< firstDay){//1日より前の枠を空白にする
createHtml += '<td></td>'
}else if (dayCount>lastDayCount){//最終日より後ろを空にする
createHtml += '<td></td>'
}else{
createHtml += '<td>'+dayCount+'</td>';
dayCount++
}
}
createHtml +='</tr>';
}
createHtml+='</table>';
document.querySelector("#calendar").innerHTML = createHtml;
console.log(createHtml);
以下htmlファイル
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>カレンダー</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="calendar"></div> <script src="js/main.js"></script></body> </html>
該当のソースコード
JavaScript
試したこと
書き方がわからなったので、あまり試せてません。
補足情報（FW/ツールのバージョンなど）
回答1件
0
CSS
1td:nth-child(1){ 2color:red; 3} 4td:nth-child(7){ 5color:blue; 6}
投稿2023/06/08 00:28
総合スコア112600
あなたの回答
tips
プレビュー
