JavaScript

JavaScript

JavaScriptのきほん「ToDoリストを作ろう(2)リストを画面に表示する」

前回は、フォームに入力された文字列を配列(todos)に追加するところまでを確認した。今回は、その配列の中身を実際に画面上のリストとして表示し、さらに「完了チェック」と「削除」の機能を追加していくことにしよう。 1. style.css(C...
JavaScript

JavaScriptのきほん「ToDoリストを作ろう(1)フォームからデータを受け取る」

これまでの記事では、ブラウザに時計やカレンダーを表示する題材を通して、DOM要素の操作やイベントリスナーの使い方を扱った。今回からは、それらの知識を踏まえて「ToDoリストアプリ」を3回に分けて作っていくことにしよう。初回となる今回は、フォ...
JavaScript

JavaScriptのきほん「ブラウザで時計を表示しよう(2)」

前回ご紹介した、『ブラウザで「アナログ時計・デジタル時計・カレンダー」を表示するHTML+Javascript』プログラムコードを改良してみよう。以下にそのプログラムコードを以下に示す。✅ 1. index.html(HTMLファイル)<!...
JavaScript

JavaScriptのきほん「ブラウザで時計を表示しよう(1)」

今回は、ブラウザで「アナログ時計・デジタル時計・カレンダー」を表示するHTML+Javascriptをご紹介しよう。各構成は以下の通りとなる。HTML構造<div class="clock" id="analog-clock">  <div...
JavaScript

JavaScriptのきほん「テンプレートリテラル」

今回は、先回ご紹介した「カレンダーを表示する関数」のうち、以下のコードを詳しくみていくことにしよう。const todayString = `${today.getFullYear()}-${String(today.getMonth() ...
JavaScript

JavaScriptのきほん「ブラウザでカレンダーを表示しよう(3)」

今回は、「ブラウザにカレンダーを表示しよう(1)」でご紹介しているJavaScriptファイルのうち、「カレンダーを表示する関数」を詳しくみていくことにしよう。このコードは、カレンダーをHTML形式で表示する関数である。// カレンダーを表...
JavaScript

JavaScriptのきほん「ブラウザでカレンダーを表示しよう(2)」

前回では、JavaScriptを使って3か月分のカレンダーをブラウザで表示する方法をご紹介した。今回は、前回のJavaScriptのコードのうち、「カレンダーを生成する関数」を詳しくみていくことにしよう。以下のコードは、指定された年と月から...
JavaScript

JavaScriptのきほん「ブラウザでカレンダーを表示しよう(1)」

JavaScriptを使ってブラウザに「3か月分のカレンダー」を表示してみよう。ちょっと日にちを確認するのにとっても便利である。JavaScriptコードをブラウザで表示するために、HTMLファイルとJavaScriptファイルを作成して、...
JavaScript

JavaScriptのきほん「イベントリスナー」

JavaScript(JS)は、軽量でインタープリター型のプログラミング言語で、主にWebページをインタラクティブにするために使用される。イベントリスナーは、特定のイベントが発生したときに実行される関数を指定するための仕組みである。Web開...
JavaScript

JavaScriptのきほん「DOM要素の操作」

JavaScript(JS)は、軽量でインタープリター型のプログラミング言語で、主にWebページをインタラクティブにするために使用される。JavaScriptからHTMLへの入出力は、DOM(Document Object Model)とい...