カレンダー効果を実現するJavaScript
|
この記事では、カレンダー効果を実現するためのJavaScriptの具体的なコードを参考までに紹介します。具体的な内容は次のとおりです。
<!DOCTYPE html>
<html>
<ヘッド>
<メタ文字セット="utf-8">
<title>カレンダーを作成する</title>
<スタイル>
本文{text-align:center;}
.box{マージン:0 自動;幅:880px;}
.title{背景: #ccc;}
表{高さ:200px;幅:200px;フォントサイズ:12px;テキスト配置:center;フロート:left;マージン:10px;フォントファミリ:arial;}
</スタイル>
<script src="calendar.js"></script>
<スクリプト>
var year = parseInt(prompt('年を入力してください:','2019'));//ポップアップ ウィンドウを作成します document.write(calendar(year));//指定された年のカレンダーを生成する関数を呼び出します</script>
</head>
<本文>
</本文>
</html>カレンダー.js
関数カレンダー(y){
//指定された年の 1 月 1 日の曜日を取得します。var w = new Date(y,0).getDay();
var html = '<div class="box">';
//各月のテーブルを連結します for(m=1;m<=12;m++){
html += '<テーブル>';
html += '<tr class="title"><th colspan="7">' + y + '年' + m+'月</th></tr>';
html += '<tr><td>日</td><td>月</td><td>火</td><td>水</td><td>木</td><td>金</td><td>土</td></tr>'
//各月の合計日数を取得します。var max = new Date(y,m,0).getDate();
html += '<tr>'; // <tr> タグの開始 for (d=1;d<=max;d++){
if(w && d== 1){//月の最初の日が日曜日でない場合は、空白を埋めます html += '<td colspan ="' + w + '"> </td>';
}
html += '<td>' +d+ '</td>';
if(w == 6 && d != max){//土曜日が月の最終日でない場合は、html += '</tr><tr>' で囲みます。
}else if(d==max){//月の最終日、</tr> タグを閉じます html += '</tr>';
}
w = (w+1>6) ? 0 : w+1;
}
html += '</table>';
}
html += '</div>';
html を返します。
}効果
以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 以下もご興味があるかもしれません:
|
<<: mysql-8.0.19-winx64 のインストール中に問題が発生しました: ディレクトリ 'xxxx\Database\' を作成できません
>>: Windows で削除された MySQL 8.0.17 のルート アカウントとパスワードを回復する方法
推薦する
VMware マルチノード環境を構成する方法
このチュートリアルでは CentOS 7 64 ビットを使用します。各仮想マシンに 2GB のメモリ...
Vue+element ui はアンカーの配置を実現します
この記事では、アンカー配置を実現するためのVue +要素UIの具体的なコードを例として紹介します。具...
要素テーブルヘッダー行の高さの問題の解決
目次序文1. 問題の原因2. 解決策VueはelementUIテーブルtr thの高さと背景色を変更...
PhpStormがVirtualBoxに接続できない問題を解決する
問題の説明: phpstorm の SFTP ホストを 192.168.122.1 に設定すると、接...
MySQLクエリが遅い場合の理由と解決策
Python プログラムを書き、Mysql ライブラリを集中的に操作したためです。データ量が多くない...
ネイティブ JS オブジェクト指向タイピング ゲーム
この記事では、JSオブジェクト指向タイピングゲームの具体的なコードを参考までに紹介します。具体的な内...
MySQLとRedisキャッシュ間の同期ソリューションについての簡単な説明
目次1. ソリューション 1 (UDF)デモケース2. ソリューション2（binlogの解析）キャナ...
mysql の find_in_set 関数の基本的な使い方
序文これは私が最近見つけた新しい機能です。プロジェクトでの私の使用シナリオは次のとおりです。アプリケ...
MySQLからClickHouseに移行する5つの方法
データ移行は、MySQL から ClickHouse にインポートする必要があります。概要プランは以...
Windows に WSL をインストールして構成する方法
WSLとはBaidu 百科事典からの一節を引用します。 Windows Subsystem for ...
CSSを使用してAndroidシステムの読み込みアニメーションを実装する
Web には一般的な読み込みアイコンが 2 つあります。1 つは iOS の「菊」、もう 1 つは ...
MySQLデータベースのSYNフラッディング問題を解決する
Syn 攻撃は、最も一般的で最も簡単に悪用される攻撃方法です。TCP プロトコルの欠陥を利用して、偽...
ウェブサイトのビジュアルデザインの重要なポイント
手工芸デザインからグラフィックデザイン、そしてウェブデザインまで、デザインの原則は同じままですが、私...
MySQL イベント変更イベント (ALTER EVENT)、イベントの無効化 (DISABLE)、イベントの有効化 (ENABLE)、イベント名の変更、およびデータベース イベントの移行操作の詳細な説明
この記事では、例を使用して、MySQL イベントの変更 (ALTER EVENT)、イベントの無効化...
テキストエリア テキストエリアの幅と高さ 幅と高さの自動適応実装コード
コードをコピーコードは次のとおりです。 <HTML> <ヘッド> <T...