要素にイベントを追加する
sample.js
取得した要素.onsubmit = function() {
処理内容
}
onsubmitの部分はイベントによって書き換える
取得した要素のイベントに＝を使ってファンクションを代入する形でイベントが発生したときの処理内容を設定。
イベントに代入するファンクションにファンクション名は付けず、{}内にreturnなし
フォームに入力内容を読み取る
sample.js
取得した＜form＞要素.読み取りたいフォーム部品のname属性.value
タグの基本動作をキャンセルする
sample.js
event.preventDefault();
Dateオブジェクト
Dateオブジェクトは以下のことができる
- 現在日時を取得する
- 過去や未来の日時を設定
- 日時の計算
Dateオブジェクトの初期化
sample.js
const now = new Date()
Dateオブジェクトを使い、日時の設定や計算を行うとき最初に初期化する必要がある。
newはオブジェクトを初期化するキーワード。
年、月、日などを個別に取得する
sample.js
const year = now.getFullYear();
const month = now.getMonth();
const date = now.Date();
const hour = now.getHours();
const min = now.MInutes();
getMonthメソッドは実際の月-1の数字が取得される。
Dateオブジェクトから日時を取得する主なメソッド
| メソッド | 説明 |
|---|---|
| getFullYear() | 年を取得する |
| getMonth() | 月を0~11の数値で取得 |
| getDate() | 日を取得 |
| getDay() | 曜日を0~&の数値で取得 |
| getHours() | 時を取得 |
| getMinutes() | 分を取得 |
| getSeconds() | 秒を取得 |
| getMiiseconds() | ミリ秒を0~999の数値で取得 |
| getTimezoneOffset() | 時差を取得 |
| getTime() | 1970年1月1日0時からの時間をミリ秒で取得 |
| setFullYear(年) | 年(西暦)を設定 |
| setMonth(月) | 月を0~11の数値で設定 |
| setDate(日) | 日を設定 |
| setHours(時) | 時を設定 |
| setMinutes(分) | 分を設定 |
| setSeconds(秒) | 秒を設定 |
| setMiiseconds(ミリ秒) | ミリ秒を0~999の数値で設定 |
| setTime(ミリ秒) | 1970年1月1日0時からの時間をミリ秒で設定 |
Mathオブジェクトの主なメソッド、プロパティ
| プロパティ | 説明 |
|---|---|
| Math.PI | 円周率 |
| Math.SQRT1_2 | 1/2の平方根 |
| Math.SQRT2 | 2の平方根 |
| メソッド | 説明 |
|---|---|
| Math.abs(x) | xの絶対値 |
| Math.atan2(y.x) | 座標(x,y)のX軸からの角度(ラジアン) |
| Math.celi(x) | xの小数点以下を切り上げる |
| Math.cos(x) | xのコサイン |
| Math.floor(x) | x小数点いかを切り捨てて、xより小さい整数にする。xが負数だった場合の結果に注意 |
| Math.max(a,b,...) | ()内のパラメータのうち最大の数を返す |
| Math.min(a,b,...) | ()内のパラメータのうち最小の数を返す |
| Math.pow(x.y) | xのy乗 |
| Math.random( ) | 0以上1未満の乱数 |
| Math.round(x) | xの小数点以下を丸める(四捨五入) |
| Math.sin(x) | xのサイン |
| Math.sqrt(x) | x平方根 |
| Math.tan(x) | xのタンジェント |
| Math.trunc(x) | xの小数点以下を単純に切り捨てる |
Math.rondom()の0以上1未満のままでは使いづらいので、通常これを0以上または1以上の整数に直す。１以上の整数を乱数で発生させたい場合は次のような式を書く。
この場合はxを欲しい数の上限に置き換える。
sample.js
Math.floor(Math.random() * x) + 1
例:サイコロの目を出したい場合はxを6にする