この記事では、カレンダー効果を実現するための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 のルート アカウントとパスワードを回復する方法
モバイル ブラウザは、Web ページを仮想の「ウィンドウ」(ビューポート) に配置します。このウィン...
cli3 でビルドされた vue プロジェクトは、ゼロ構成ファイルとして知られています。パッケージ化...
Docker を実行するには root 権限が必要です。非 root ユーザーに docker コマ...
更新: MySQL の公式 Web サイトにアクセスして MySQL インストーラーをインストールし...
httpとhttpsの違いは一部のウェブサイトでは、http を開くと、安全ではないというメッセージ...
序文add_header は、headers モジュールで定義されたディレクティブです。名前が示すよ...
いくつかのテーブルまたは単一のデータベースのみをバックアップする場合は、innobackup よりも...
目次Docker の基本概念Docker インストール プロセス (Centos6.9)カーネルのア...
1. pc-reset PCスタイルの初期化 /* 正規化.css */ html{ 行の高さ: 1...
el-form フォームにルールを追加します。データにルールを定義する定義されたルールをel-for...
コードと同様に、テーブルや列にコメントを追加して、他のユーザーがその機能を理解できるようにすることが...
目次序文typeof は型を正しく判別できますか? instanceof は型を正しく判別できますか...
この記事では、例を使用して、MySQL レプリケーションの原理と実際のアプリケーションについて説明し...
目次1. redo ログ (MySQL ストレージ エンジン InnoDB のトランザクション ログ...
1. テーブル内のフィールドの大文字と小文字の区別を設定するgorm クエリを使用する場合、MySQ...