2023年2月5日 / 最終更新日時 : 2023年12月23日 erkennt_blog_user HTML A010 HTMLの基本構造 HTMLとは「ハイパーテキスト・マークアップ・ランゲージ(Hyper Text Markup Language)」のことで、WEBページを作成するための言語です。今回はこのHTMLの基本について紹介します。 HTMLの書 […]
2023年2月6日 / 最終更新日時 : 2023年12月23日 erkennt_blog_user HTML A020 HTMLタグ HTMLタグの基本 ホームページなどのWebサイトを作成する際に活用するHTMLタグとは、文章の構造をコンピューターに指示し、見出しや段落、画像の表示や他の文書へのリンクなどを指定する記法です。具体的にどのようなものなの […]
2023年2月6日 / 最終更新日時 : 2023年4月6日 erkennt_blog_user HTML A030 HTMLファイルの保存と表示 HTMLファイルの基本 今回はエディタを用いて、HTMLファイルの保存方法と完成したHTMLファイルをブラウザで表示する方法を紹介します。 ※手順の画像はMacBookProを用いております。また、エディタはVisual […]
2023年2月7日 / 最終更新日時 : 2023年12月23日 erkennt_blog_user HTML A040 リンクの表示 <a>タグ リンクを表示させるためには<a>タグを用います。 <a>タグはアンカー(Anchor)の略で、出発点、または到達点を示す要素です。href属性が指定されたa要素は出発点とし […]
2023年2月9日 / 最終更新日時 : 2023年12月23日 erkennt_blog_user HTML A050 画像ファイルの表示 <img>タグ 「A020 HTMLタグ」のコンテンツ内でも紹介をさせていただきましたが画像を表示させるためには<img>タグを用います。 一般的なブラウザで表示できる画像フォーマットとしては、PNG・ […]
2023年2月11日 / 最終更新日時 : 2023年4月6日 erkennt_blog_user HTML A060 入力フォームの表示 <form>タグ formタグとは、HTMLでフォームを作るためのタグのことです。また、フォームとは、入力欄や送信ボタンの集まりのことを指します。フォームを使うと、名前やメールアドレスなどのブラウザで入力され […]
2023年2月11日 / 最終更新日時 : 2023年12月23日 erkennt_blog_user CSS A070 CSSの基本書式 CSSとは CSSとは、Cascading Style Sheet(カスケーディング・スタイルシート)の略で、スタイルシート言語の1つです。HTML文書のレイアウトを調整したり、「見出し」や「段落」などのデザインを指定す […]
2023年2月11日 / 最終更新日時 : 2023年12月23日 erkennt_blog_user CSS A080 スタイルシートの記述 スタイルシートの記述方法 今回は実際にCSSを記載する際の方法や書き方の例を紹介いたします。下記のHTMLを例にブラウザ表示のようになるようCSSを追加していきましょう。 ブラウザ表示 タイトル 本文 まとめ CSSファ […]
2023年2月11日 / 最終更新日時 : 2023年4月6日 erkennt_blog_user CSS A090 CSSファイルの作成と保存 CSSファイルの基本 今回はエディタを用いて、CSSファイルの保存方法と完成したCSSファイルをブラウザで表示する方法を紹介します。 ※手順の画像はMacBookProを用いております。また、エディタはVisual St […]
2023年2月11日 / 最終更新日時 : 2023年12月23日 erkennt_blog_user CSS A100 CSSファイルの読み込み CSSファイルの読み込み方 今回は別ファイルのCSSを読み込む方法を紹介いたします。どのようにして HTMLファイルからCSSを読み込むのか確認していきましょう。 HEAD内に読み込みコードを記載 CSSファイルの基本的 […]
2023年2月11日 / 最終更新日時 : 2023年12月23日 erkennt_blog_user CSS A110 CSSのセレクタ CSSのセレクタについて スタイルを適用したい要素を指定する際に用いられる「CSSセレクタ」ですが、CSSセレクタには幅広い種類があり、様々な指定方法があります。 CSSの基本書式でも少しご紹介いたしましたが、おさらいを […]
2023年2月11日 / 最終更新日時 : 2023年12月23日 erkennt_blog_user CSS A120 文字の装飾 文字装飾の基本 CSSを用いて文字サイズや色の変更などを行うプロパティを紹介します。今回紹介するプロパティ以外にも文字を装飾するプロパティは存在するので、文字装飾に関する頻出プロパティを7つ抜粋しました。 文字装飾を行う […]
2023年2月11日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user CSS A130 背景の装飾 背景の装飾について 今回はcssを使用した背景の装飾についてです。背景色や背景画像などWebページを作る上で背景の装飾はとても大切です。backgroundを用いた様々なプロパティを紹介します。 元になるHTMLは以下に […]
2023年2月13日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user CSS A140 位置の調整 位置の調整について CSSで文字や要素の位置の調整を行いたい場合に使用するプロパティは多くあります。 今回は要素の位置を調整するときに使うプロパティについて紹介します。 位置調整の際に使うプロパティ position p […]
2023年2月13日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの基本 A150 JavaScriptの基本的な記述方法 JavaScriptについて JavaScriptとは、Webブラウザ上で動作するプログラミング言語の一つです。 Webページは一般的にHTMLを用いてつくられますが、それだけでは文章や画像をそのまま表示するだけで面白み […]
2023年2月13日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの基本 A160 HTML内でJavaScriptスクリプトを実行 JavaScriptの書き方は、基本的には2通りの方法があります。1つはHTMLファイル上に <script>というタグを書いて、その中に命令を書いて実行する方法です。もう1つは、script.js […]
2023年2月13日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの変数 A170 変数(JavaScript)とは JavaScript で変数を利用するには最初に変数の宣言を行う必要があります。今回は JavaScript で変数を宣言する際の詳細について紹介します。 変数について 変数宣言 変数はlet 変数 = 値と書くことで定 […]
2023年2月13日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの変数 A180 変数名の付け方 変数名の付け方について JavaScript ではひとつのプログラムの中で複数の変数を使用することができ、それぞれの変数には異なる値を格納することができます。複数の変数を識別するため、それぞれの変数には変数名を付けます。 […]
2023年2月13日 / 最終更新日時 : 2023年4月6日 erkennt_blog_user JavaScriptの変数 A190 変数の参照(リファレンス) JavaScriptでは値の代入が行われる際に、値をそのまま渡すのではなく、参照先を渡すような仕様のことを参照渡しといいます。今回はそのような実際にに行われている代入方法について紹介します。 値の代入について 値渡し 値 […]
2023年2月14日 / 最終更新日時 : 2023年4月6日 erkennt_blog_user JavaScriptの変数 A200 変数の種類と有効範囲 変数は、どの範囲からアクセスできるかによって2種類の範囲(スコープ)をもち、それぞれグローバル変数、ローカル変数と呼ばれます。JavaScriptでは、関数の外側で宣言した変数はグローバル変数として扱われ、プログラムのど […]
2023年2月14日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの変数 A210 変数の型の変換 JavaScript で使用される色々なデータ型の値は、必要に応じて自動的に型が変換されます。ここでは型変換が行われるときにどのように変換されるのかについて紹介します。 型の変換方法 文字列(String型)への変換 文 […]
2023年2月14日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの定数 A220 定数の基本と予約語 定数とは変数と違い、再代入による変更ができず、再宣言もできない定義方法です。値を変更したくない、もしくは変更する必要がない際に用います。今回はこの定数について紹介します。 定数とは 定義方法 定数は下記のように定義します […]
2023年2月14日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの文字列 A230 文字列の基本構文 プログラミングでは文字の羅列を文字列と呼びます。今回は、この文字列についての詳細を紹介します。 文字列の基本 下記に様にクォーテーションで囲うことで文字列を定義することができます。 シングルクォーテーションとダブルクォー […]
2023年2月14日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの文字列 A240 文字列の連結・分割 JavaScriptでは文字列を連結・分割されるケースが多くあります。今回は文字列の連結や分割方法について紹介します。 文字列の連結方法 プラス演算子 プラス演算子「+」を用いると、文字列を結合します。 concatメソ […]
2023年2月14日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの文字列 A250 エスケープシーケンス エスケープシーケンスとはキーボードで入力できない文字のことを指します。今回は、代表的なスケープシーケンスとその表し方を紹介します。 エスケープシーケンスについて 代表的なエスケープシーケンス 記号 概要 \b   […]
2023年2月14日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの演算子 A260 論理演算子(JavaScript) 論理演算子とは、「集合」や「命題」などの論理演算を行うためのものです。if文の条件判定などに用いることが多く、真(true)または偽(false)を判定することができます。 論理演算子の種類 || (OR:論理 […]
2023年2月15日 / 最終更新日時 : 2023年4月6日 erkennt_blog_user JavaScriptの演算子 A270 比較演算子(JavaScript) 比較演算子とは二つの式や値の比較を行い、結果を真偽値(trueまたはfalse)で返す演算子です。学問としての数学と同じ表現もあれば、プログラミング特有の表現もあります。今回はその比較演算子について紹介します。 比較演算 […]
2023年2月15日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの演算子 A280 代算・代入演算子 代入演算子とは変数に対して値を代入するときに用いられます。複雑な代入方法もありますので今回は代入演算子について紹介します。 代入・代算演算子について 演算子 名称 意味 = 代入 x = y += 加算代入 x = x […]
2023年2月15日 / 最終更新日時 : 2023年12月23日 erkennt_blog_user JavaScriptの演算子 A290 インクリメント・デクリメント演算子 インクリメント・デクリメント演算子とは数値に1を加算もしくは減算する際に用いる演算子です。+1、-1と記載することも可能ですが、より簡潔に記載するために用いられます。今回はそのインクリメント・デクリメント演算子について紹 […]
2023年2月15日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの条件分岐 A300 if – else文 if文は条件や値によって処理を分岐させ、一致する場合の処理と、一致しない場合の異なる処理を記述するための方法です。これまで紹介してきて演算子などもif文と伏せて用いることも多いです。今回はそのif文について紹介します。 […]
2023年2月15日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの条件分岐 A310 switch – case文 switch 文とは複数の値の中のいずれかと一致するかどうかを調べ、実行する処理を分ける方法です。条件によってはif文よりもswitch文の方が簡潔なコードで処理を実現できるケースもございます。今回はswitch文につい […]
2023年2月15日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの繰り返し A320 for文 for文は繰り返し処理を行う方法のひとつです。for 文では指定した回数だけ繰り返し処理を行います。今回はそのfor文について紹介します。 for文の基本 for文の基本構文 イメージが湧きにいくかと思いますので具体的な […]
2023年2月15日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの繰り返し A330 for – in文 / for – of文 for – in文とfor – of文はfor文のように繰り返し処理を行う構文です。繰り返し処理を行う対象が、オブジェクトの際はfor – in文を用いて、配列の場合はfor R […]
2023年2月15日 / 最終更新日時 : 2023年12月28日 erkennt_blog_user JavaScriptの繰り返し A340 while文 / do – while文 while文 / do – while文はfor文同様に繰り返し処理を行う構文です。記載方法や特徴など異なる点も多いので今回はwhile文 / do – while文について紹介します。 whil […]
2023年2月16日 / 最終更新日時 : 2023年4月6日 erkennt_blog_user JavaScriptの配列 A350 配列 配列とは、プログラミングにおいて複数の値を1つのデータのように取り扱うデータ構造のことです。配列の中に格納される値を要素と言います。複数の要素を持つデータを作成することで、様々な属性を持ったデータを表現することができます […]
2023年2月16日 / 最終更新日時 : 2023年4月6日 erkennt_blog_user JavaScriptの配列 A360 連想配列 連想配列は、配列の添字に好きな名前をつけることができる配列です。この連想配列で使われる好きな名前をつけた添字のことを「キー」といいます。普通の配列の「添字」と連想配列の「キー」は、呼び方は異なりますが使い方は同じです。今 […]
2023年2月16日 / 最終更新日時 : 2023年12月29日 erkennt_blog_user JavaScriptの配列 A370 mapメソッド mapメソッドは配列データに使うメソッドであり、各要素1つずつに対して「コールバック関数」を実行し、その結果を新しい配列として返すことが出来るようになっています。今回はこのmapメソッドについて紹介します。 mapメソッ […]
2023年2月16日 / 最終更新日時 : 2023年12月29日 erkennt_blog_user JavaScriptの日付 A380 日付/時刻 JavaScriptで現在の時刻を表示する場合は、Dateオブジェクトを作成し、日付や時刻を取得するメソッドを呼び出すことで日付や時刻の要素を取得できます。今回は、日付/時刻の扱い方について紹介します。 日付/時刻の取得 […]
2023年2月17日 / 最終更新日時 : 2023年12月29日 erkennt_blog_user JavaScriptの関数 A390 関数宣言と呼び出し 関数内では呼び出し元からどのような値を受け取るのか、呼び出された時にどのような処理をするのか、そして呼び出し元にどのような値を返すのかについて記述していきます。今回は、JavaScript にて関数を定義する方法とその呼 […]
2023年2月17日 / 最終更新日時 : 2023年12月29日 erkennt_blog_user JavaScriptの関数 A400 関数の引数とデフォルト値の設定 関数を呼び出す時、呼び出し側から関数へ値を渡す際に引数と呼ばれるものを用いることができます。関数は渡されてきた値を受け取り引数のところに記述した変数に格納したあと、関数のブロック内で利用することができます。今回は引数を使 […]
2023年2月17日 / 最終更新日時 : 2023年12月29日 erkennt_blog_user JavaScriptの関数 A410 関数の戻り値 戻り値とはメソッドや関数などの実行が完了した際に、呼び出し元に返される値のことです。JavaScriptでは、return文を使って戻り値を呼び出し元に返すことが可能です。今回はこの戻り値とreturn文について紹介しま […]
2023年2月17日 / 最終更新日時 : 2023年12月29日 erkennt_blog_user JavaScriptのオブジェクト A420 オブジェクト オブジェクトは、関連するデータや機能の集合体であり、いくつかの変数やメソッドで構成されることもあります。配列と違い、ペアでデータを格納できるという点もオブジェクトの特徴の一つになります。今回はオブジェクトについて紹介しま […]
2023年2月17日 / 最終更新日時 : 2023年12月29日 erkennt_blog_user JavaScriptの例外処理 A430 例外処理の基本 プログラムを実行する際にエラーが起こることがあります。通常はエラーが起こった際、そこでプログラムは止まりますが、エラーが起こってもプログラムに止まって欲しくない場合もあります。今回はその際に用いる構文について紹介します。 […]
2023年2月18日 / 最終更新日時 : 2023年12月29日 erkennt_blog_user JavaScriptのフォーム送信 A440 フォーム送信(submit) submitとはユーザーがフォーム上でENTERキーを押したり送信ボタンを押すことで発生するイベントのことです。今回はこのsubmitについて紹介します。 submitとは submit()の基本構文 HTMLのform […]
2023年2月22日 / 最終更新日時 : 2023年12月29日 erkennt_blog_user JavaScriptのログ A450 ロギング Console オブジェクトではコンソールに対して変数に格納されている値や任意の文字列を出力するためのメソッドがいくつか用意されています。それぞれのメソッドの基本的な機能は同じですがコンソールに表示される見た目が異なりま […]
2023年2月22日 / 最終更新日時 : 2023年12月29日 erkennt_blog_user JavaScriptの非同期通信 A460 非同期通信(ajax)とは Ajaxとは Asynchronous JavaScript + XML の略で、XMLHttpRequestオブジェクトを使用してサーバと通信を行う技術です。今回はこの非同期通信(ajax)について […]
2023年2月22日 / 最終更新日時 : 2023年12月29日 erkennt_blog_user JavaScriptの非同期通信 A470 非同期通信(Ajax)におけるデータの送信、取得、参照 非同期通信(Ajax)とはHTTPプロトコル通信で、HTMLやPHPファイルからリクエスト送信をHTTPサーバに送信して、レスポンスをブラウザ側で受信する動作を非同期通信で受け取ることができる技術です。今回はこの技術を用 […]
2023年2月22日 / 最終更新日時 : 2024年1月13日 erkennt_blog_user JavaScriptのライブラリ A480ライブラリとフレームワーク ライブラリとは、汎用的に使える機能を「部品」にして、再利用可能にしたものをいくつかまとめてセットにしたファイルのことです。そのセット全てを必ず使うというものではなく、そのライブラリの中から必要なものだけ引っ張り出して使う […]