テンプレートリテラルを使ってみる
JavaScriptの文字列内で変数が使えるようになる、テンプレートリテラルを使ってみます。...
VanillaJSの記事一覧
JavaScriptで入力した文字数をカウントする
フォームの文字数制限があるフィールドでたまに見かける、入力した文字数や残り文字数が表示される処理を実装してみます。...
JavaScriptでフォームの送信を一時停止する
フォームの送信が実行された際、送信前に別の処理を挟んでから送信を実行したいということがあったのですが、VanillaJS...
文字列の両端の空白を取り除く
フォームで入力された値の前後に含まれる空白スペースを削除するという実装がたまにあるので、文字列の両端の空白を取り除く方法...
論理積(&&)と論理和(||)の短絡評価
if文で&&を使った際の挙動で思っていたのと違うということがあったので、調べたことをメモ。...
padStart()で数値の桁数を揃える
以前に桁数を揃える処理を実装しましたが、padStart()メソッドで簡単に実装できそうだったので試してみます。...
JavaScriptのreplaceAll()を使ってみる
文字列を置換する際、複数箇所マッチした場合でもすべて置換できるreplaceAll()を使ってみます。...
オプショナルチェーン演算子を使ってみる
オプショナルチェーン(optional chaining)演算子を使って、オブジェクトの中を参照する方法を試してみます。...
アクセシビリティを考慮したアコーディオンを実装する
アコーディオンの実装をすることはよくありますが、アクセシビリティを考慮した場合の実装についてあまり意識したことがなかった...
JavaScriptで月末日を取得する
JavaScriptで指定した月の最後の日を取得する方法をメモ。...
URLのパラメータを引き継ぐ
ページアクセス時にURLに付与されているパラメータを、ページ内の特定のリンクに引き継がせたいということがあったので、実装...
setIntervalとsetTiemoutで関数に引数を渡す
以前にsetIntervalとsetTiemoutの関数に引数を使う方法の記事を投稿しましたが、setIntervalと...
JavaScriptとCSSで同じ変数を使用する
アニメーションの時間など、同じ値をJavaScriptとCSSで扱いたいことがあります。 それぞれで変数で管理するでも問...
JavaScriptのStrictモードを使ってみる
JavaScriptのStrictモード(厳格モード)について簡単に試してみます。...
iframe外からiframe内のスクロール位置を変更する
iframeを使って別ページを読み込んだ際に、そのiframeのスクロール位置をiframe外から制御したいということが...
canvasで画像をwebpに変換する
以前にcanvasの内容を画像に変換する記事を投稿しましたが、変換時のファイル形式でwebpを指定することもできるので、...
JavaScriptの実行タイミングについて
JavaScriptが実行されるタイミングとしては、大きく分けて以下の4種類あります。 直ぐに実行 DOMの読み込み完了...
簡易的なスライダーを実装する
サイト構築時にスライダー処理が必要な際はライブラリを使用することが多いですが、ライブラリを使用するほどでもない軽微なスラ...
フォーム内のbuttonタグで送信されないようにする
formタグ内でフォーム送信ボタンとは別にbuttonタグを配置したい場合に、クリックでフォームを送信しないようにする方...
変数の型や存在するかどうかなどを調べる
JavaScriptで変数の型や存在するかどうかなどを調べるパターンをいくつか試してみます。...