ITメモ
JavaScript
「Javascript」の基礎知識
「Javascript」とは「Node.js」とは「Ajax」とは「chart.js」とは「Javascript」の使い方「Javascript」の「エラーチェック」をする方法「Javascript」の「変数」「Javascript」の「配列（Array）」「Javascript」の「DOM（Document Object Model）」の「使い方」「Javascript」の「関数 / Function」「Javascript」の「条件分岐・繰り返し」「Javascript」の「イベントハンドラー（Event Handler）」「Javascript」の「文字」を操作する方法「Javascript」の「文字」を検索する方法「Javascript」の「スコープ」「Javascript」の「ファイル操作方法」「Javascript」の「画像操作方法」「Javascript」の「情報」を出力・チェックする方法「Javascript」での「ヒアドキュメント」の使い方「Javascript」の「Built-in Object（ビルトインオブジェクト）」「Javascript」の「ライブラリー / Library」Reference
数字
「Javascript」で「計算」に誤差が出る時の解決方法ファイル読み込み
「XMLHttpRequest」オブジェクト - サーバーのファイルを読み込む方法イベント
ページ読み込み時に「Javascript」を実行する方法画像読み込みが完了してから、次の処理を実行する方法「addEventListener()」の使い方 - イベントが発生したのを検知して実行する方法要素情報
HTMLタグの「class」属性値を取得、変更する方法「querySelector()」の使い方 - HTML要素の情報を参照・設定する方法「querySelectorAll()」の使い方 - 要素内の指定した子要素を参照・設定する方法「classList」プロパティ - HTMLタグ属性値「class」の情報を参照・確認・追加・削除する方法「getElementById()」の使い方 - HTML要素の情報を「ID名」で参照・設定する方法「getElemetnsByClassName()」の使い方 - HTML要素の情報を「クラス名」で参照・設定する方法「Node.Childnodes」の使い方 - 要素内の子要素を参照・設定する方法「ParentNode.children」の使い方 - 要素内の子要素を参照・設定する方法要素の配置位置を確認する方法Style関連
スタイル属性（色・線・大きさなど）を参照・変更する方法「getPropertyValue」メソッド - 指定されたCSSプロパティの値などを取得する「getComputedStyle」メソッド - CSSを適用したスタイルを参照するページ関連
Webページのタイトルを変更する方法「モニター」情報を取得する方法「ブラウザ」情報を取得する方法「ページ」情報を取得する方法「イベント」情報を取得する方法「マウス」情報を取得する方法サイズ関連
要素の縦・横サイズを参照・変更する方法「モニター」「ブラウザ」のサイズ情報を取得する方法端末情報
スマートフォンからのアクセスを識別する方法Library「jQuery」
【jQuery】とは【jQuery】の書式【jQuery】「Javascript」にリンクさせる方法【jQuery】「Javascript」に記述する方法【jQuery】のオブジェクト【jQuery】「CSS」を参照・設定する方法【jQuery】「HTML」要素の情報を参照・設定する方法【jQuery】「HTML」タグを追加する方法【jQuery】ユーティリティ関数【jQuery】イベントアクションを設定する方法【jQuery】イベントオブジェクト「.on」の使い方【jQuery】読み込み完了してから実行する「.ready」の使い方【jQuery】「Ajax」を使う方法【jQuery】「エフェクト」「アニメーション」を使う方法
【Javascript】情報を出力・チェックする方法
情報を出力してチェックできるメソッド
「Javascript」では、
情報を出力して、チェックできる方法がある。
出力ができる関数
| console.log() | ブラウザに付属しているコンソールに情報を出力できる。 |
| メソッド | 説明 |
|---|---|
| document.write() | Webページに情報を出力できる。 |
| document.writeln(); |
Webページに情報を出力できる。 出力内容の後に、「改行」文字を一緒に出力してくれる。 |
| alert() | ポップアップしてくるアラート画面に、情報を精細する。 |
| blob() | 情報をファイルに出力する。 |
Back
「console.log()」メソッドの使い方
「console.log()」メソッドは、「コンソール」に出力ができるメソッド。
「コンソール」は、Webブラウザの機能の１つで、
開発の色々なチェックなどに使われる機能の１つ。
「Windows」の「コマンドプロンプト」の参照用タイプのWebブラウザ版みたいなもの。
「console.log()」メソッドの書式
console.log("出力したいテキスト");
console.log(変数);
console.log(変数 + "出力したいテキスト" + 変数);
Back
「document.write()」メソッドの使い方
「document.write()」メソッドは、
Webページに文字を書き出したい時などに利用する。
「document.write()」メソッドを利用すると、 Webページにそのまま文字として出力される。
「document.writeln()」を使うと、出力内容の後に「改行」を加えてくれる。
「document.write()」メソッドの書式
document.write("出力したいテキスト");
document.write(変数);
document.write(変数 + "出力したいテキスト" + 変数);
document.write(変数);
document.write(変数 + "出力したいテキスト" + 変数);
Back
「alert()」メソッドの使い方
「alert()」メソッドは、警告メッセージのように、
画面に確認メッセージを表示できる機能。
ポップアップした画面は、「OK」ボタンを押すことで、非表示にできるので、 必ず通知したい内容など記述するのに便利。
「Javascript」のエラーチェックにも使えるので、
実行して参照したデータを「alert()」メソッドで確認するのにも使える。
「alert()」メソッドの書式
alert("表示したいテキスト");
alert(変数);
alert(変数 + "表示したいテキスト" + 変数);
alert(変数);
alert(変数 + "表示したいテキスト" + 変数);
Back
「blob()」メソッドの使い方
「blob()」メソッドの書式
let blob = new Blob(['ファイル内容'],{ファイルタイプ"});
let blob = new Blob(['ファイル内容テキスト'],{type:"text/plan"});
//HTMLタグ「a（リンク）」を作成
let link = document.createElement('a');
//作成した「a」タグのリンク先URLを作成してリンク先を指定。
link.href = URL.createObjectURL(blob);
//リンクを実行してファイルがダウンロードされる時のファイル名を指定。
link.download = '作ったファイル.txt';
//リンクをクリックして実行するコード
link.click();
let blob = new Blob(['ファイル内容テキスト'],{type:"text/plan"});
//HTMLタグ「a（リンク）」を作成
let link = document.createElement('a');
//作成した「a」タグのリンク先URLを作成してリンク先を指定。
link.href = URL.createObjectURL(blob);
//リンクを実行してファイルがダウンロードされる時のファイル名を指定。
link.download = '作ったファイル.txt';
//リンクをクリックして実行するコード
link.click();
Back
