2021-08-01から1ヶ月間の記事一覧

JavaScript 位置情報

位置情報の取得 navigator.geolocation.getCurrentPosition(success, fail); 第一引数に位置情報が取得できた時に呼び出すfunction名を記述 第二引数には失敗した時に呼び出すfunction名を記述 success functionが呼び出された時には位置情報がパラメータと…

jQuery

jQuery jQueeryを使うためにHTMLに下記のように記述 <script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js"></script> バージョンはその都度必要なものを使用 下記URL参照 https://code.jquery.com/ $( ) ... 要素をjQueryオブジェクトに変換してメソッドを使えるようにする * $( )で取得した要素が複数ある場合、その全て…

JavaScript thisやonclickイベントを使って画像切り替え

this イベントが発生した要素を指す onclickイベントを使った例 'use strict'; //画像を配列に格納 const thumbs = document.querySelectorAll('.thumb'); thumbs.forEach(function(item, index){ //各画像がクリックされた時にイベントが発生 item.onclick …

JavaScript 配列やオブジェクトの記入例

配列 const array = [a, b, c]; オブジェクト const object = { id: 1, name: a} 配列-配列 const array = [ [a, b, c], [a, b, c] ] オブジェクト-オブジェクト const object = { id: {x: 1, y: 2}, name: {x: a, y: b} } 配列-オブジェクト const array = …

JavaScript CSSセレクタを使ってHTMLを変更(DOM操作)

DOM操作 HTMLやCSSを書き換えたりする処理のこと 基本的に出力はDOM操作 HTMLの属性の読み取り 読み取り 取得した要素.属性 書き換え 取得した要素.属性 = 値; documentメソッド .querySelector documentの .querySelector メソッドは()内に書かれたCSSセレ…

JavaScript Mathオブジェクト

定数 プロパティ 説明 .e ネイピア数(E。自然対数の底) .LN2 2の自然対数 .LN10 10の自然対数 .LOG2E 2を底とするEの対数 .LOG10E 10を底とするEの対数 .PI 円周率 SQRT1_2 1/2の平方根 .SQRT2 2の平方根 メソッド メソッド 説明 .abs(x) xの絶対値 .ceil(x)…

JavaScript 日時の取得

現在の日時の取得をする const 変数名 = new Date(); Dateオブジェクトのインスタンス化をする 日時を扱うメソッド Dateオブジェクトの変数名.メソッド メソッド 説明 getFullYear() 年を取得 getMonth() 月を取得(0~11の数値) getDate() 日を取得 getDay() …

JavaScript 様々なメソッド(setTimeout,padStart)

setTimeout( ) 指定したミリ秒後にfunctionを実行する function function名(){ setTimeout(ミリ秒後に実行するfunction名, 1000); } padStart( ) ある文字列の数に文字数を揃えるメソッド String(データ).padStart(桁数, 先頭につける文字) String()でString…

JavaScript formタグの入力内容を取得/タグの基本動作をキャンセル

formの入力内容を取得 submitボタン押下時の処理 submitボタンが押されたらaction属性のURLに入力内容が送信される。 onsubmitイベントはボタンが押された直後で入力内容が送信される前に発生する document.getElementById('id名').onsubmit = function(){ …