JavaScript(ジャバスクリプト)

JavaScriptを使用して、フォームの入力内容を確認する方法について説明します。 制御構文（入力欄が空欄かどうか） まず、制御構文を使用して、入力された値が適切かどうかを確認します。 以下は、例として、フォームの入力欄が空欄でないことを...

オブジェクトとは JavaScriptにおけるオブジェクトは、キーと値のペアの集合で構成されます。キーは文字列であり、値には任意のデータ型を使用できます。オブジェクトは、波括弧 {} 内にキーと値をカンマで区切って定義します。 例えば、以下...

即時関数(IIFE: Immediately Invoked Function Expression)とは？ JavaScriptの即時関数(IIFE: Immediately Invoked Function Expression)は、関...

コメントアウトとは？ JavaScriptにおいてコメントアウトとは、プログラムの中で人間が読みやすくするために、実行時には無視されるようにする機能ことです。 コメントアウトは、プログラムに対するメモや付属事項を書いたり、コードの一部を一時...

セッションとCookieは、Webサイトにアクセスするユーザー情報を保持するための方法です。今回は、前回のCookie例のひとつで「カート情報の保持」について見ていきます。 カート情報の保持（Cookie） ECサイトの場合、ユーザーがカー...

Session（セッション）ととCookieは、Webサイトにアクセスするユーザー情報を保持するための方法です。以下のような違いがあります。 保持する情報の種類 Cookieは、ユーザーのブラウザに保存される小さなテキストファイルで、主にユ...

Cookieを使って再訪問時の実行を制御する このコードは、Cookieを使って、例えば２回目の訪問ユーザーにポップアップ広告を制御するといった場合のひとつの方法です。 Cookieを使用して、ユーザーが最後にポップアップを閉じた時間を追跡...

再訪問時の実行を制御する このコードは、ブラウザーキャッシュを使用して、例えば２回目の訪問ユーザーにポップアップ広告を制御するといった場合のひとつの方法です。 ポップアップが表示された時間を保存するために、ブラウザーキャッシュ内に "pop...

ポップアップを制御する（popup_cache） このコードは、local storage（ローカルストレージ）を使用して２回目の訪問ユーザーにポップアップ広告を制御するためのひとつの方法です。ポップアップが表示された時間を保存するために、...

titleを書き換える｜document.title JavaScriptを使用して、ウェブページのタイトルを書き換えるには、以下のように書きます。 document.title = "新しいタイトル"; このコードでは、documentオ...

無料で使える郵便番号検索APIを使って、住所を自動入力してみます。 zipcloud フォームのHTMLを作る まずは、フォームのHTMLを作ります。 <form> <label for="zip">郵便番号：</label> <input...

JavaScriptで他のページにリダイレクトするには、以下のように設定します。 .location.href locationオブジェクトのhrefプロパティにリダイレクト先のURLを設定します。 window.location.href...

セミコロン（;）の記号を忘れると JavaScriptにおいて、セミコロン（;）を忘れると、次のような影響があります。 文法エラー: セミコロンはJavaScriptの文の終わりを示す重要な役割を果たしています。セミコロンを忘れると、文法エ...

XMLHttpRequestとは？ XMLHttpRequest（XHR）は、JavaScriptを使用してウェブページとサーバーとの間でデータを非同期に送受信するためのAPIです。XHRは、ウェブページの再読み込みなしでデータを取得したり...

.addEventListener()とは？ JavaScriptで、.addEventListener()はイベントリスナーを登録するためのメソッドです。 下記のように使用します。 window.addEventListener('loa...

Canvas（キャンバス）とは？ Canvasは、JavaScriptでグラフィックスを描画するためのHTML5要素の1つです。 Canvas要素は、width（幅）とheight（高さ）属性を指定してHTMLドキュメント内に配置されます。...

コールバック関数とは？ コールバック関数とは、JavaScriptにおいて非同期処理を行うための重要な概念の1つです。 非同期処理は、処理の完了を待たずに次の処理を実行することを可能にするため、プログラムのパフォーマンスを向上させることがで...

アロー関数とは？ アロー関数は、ES6（ECMAScript 2015）で導入された、簡潔な構文で関数を定義する方法です。従来の関数定義よりも簡潔で読みやすく、特にコールバック関数を扱う際によく利用されます。 以下はアロー関数の基本的な書き...

今回は、json（JavaScript Object Notation）とは何か？についてご紹介します。 JSONとは？ JSONとは「JavaScript Object Notation」の略で、データを表現するための軽量でテキストベース...

このスクリプトは、ul要素の子要素であるli要素から、各li要素の子要素であるa要素を取得して、li要素と入れ替えるものです。 各li要素の子要素であるa要素を取得して、li要素と入れ替える このスクリプトを実行することで、特定のクラス名の...

JavaScriptのアニメーションを作成することで、目を引くウェブサイトを作成することができます。以下は、人々を驚かせるかもしれない、いくつかのアイデアです。 サンプルページはこちら▼ JavaScriptの４つのアニメーション例 キャン...

JavaScriptはWeb開発において重要なプログラミング言語であり、抑えておくべきポイントは多岐にわたりますが、以下にいくつか挙げてみます。 基本構文 基本構文：JavaScriptの基本的な構文を把握することが重要です。 変数の宣言方...

UserAgent（ユーザーエージェント）とは？ UserAgent（ユーザーエージェント）とは、WebブラウザやクローラーなどのHTTPクライアントが、サーバーに送信するリクエストヘッダーの一部です。この情報には、クライアントの種類、バー...

scriptタグとは？ JavaScriptを実行する方法として、scriptタグを使う方法があります。この方法は、Webページ内にJavaScriptコードを直接埋め込んで実行する方法です。 scriptタグを使用すると、HTMLのページ...

JavaScriptで使用されるaddEventListenerメソッドは、様々なイベントをリッスンすることができます。以下に一般的なイベントのリストを示します。 addEventListenerメソッドとは？ addEventListen...

JavaScriptを使用して、スマートフォンとパーソナルコンピュータ(PC)を判断する方法はいくつかあります。以下は、よく使用される方法の一例です。 User Agentの検出 User Agentは、WebブラウザーがWebサーバーに送...

以下のようにHTMLとJavaScriptを組み合わせて、クリックすると音が鳴るボタンを作ることができます。 HTML5のaudio要素を使用する まずは、WEB上の特定の場所にメディアをアップロードします。ワードプレスの場合はメディアの場...

DOM（Document Object Model）とは？ DOM（Document Object Model）とは、HTML文書やXML文書をプログラムから操作するための仕組みです。JavaScriptを使ってDOMを操作することで、We...