DUB DESiGN

JavaScriptの.addEventListener()でボタンクリックで画像の切り替え

JavaScriptの .addEventListener() を使ってボタンクリックで画像を切り替えするのと同時に、JavaScriptのループを使って「どのボタンが現在アクティブなのか？」を視覚的に切り替えます。 応 ...

2023/07/29 20:13

JavaScriptのFileReader.readAsText()でCSVをインポートしてテーブルで表示

JavaScriptのFileReader APIを利用して、CSVファイルを読み込み、その内容をHTMLテーブルとして表示する方法について解説します。 特に FileReader.readAsText() メソッドの使 ...

2023/07/27 21:00

JavaScriptの.insertBefore()でhタグ間の要素をdivタグで括る（囲む）

WordPressのようなエディタで、ヘッダータグ（h1〜h6）とその中の要素をグループ化しようと思うと、HTMLタグで書く必要があったりと、なかなか不便なケースがあります。 この記事では、そんなヘッダー間の要素を自動的 ...

2023/07/23 15:36

JavaScriptのfor (let i =)でラジオ・チェックボックスの選択で計算をして合計金額を算出

この記事では、ラジオ・チェックボックスの選択することで、動的に価格が更新される見積もりフォームの作成について解説しています。 HTMLでフォームのレイアウトを作り、JavaScriptでユーザーの選択に応じて価格を算出、 ...

2023/07/23 11:48

JavaScriptのsessionStorageでページを訪れたユーザーをランダムに”A”または”B”のページに割り当ててA/Bテスト

LPのようなウェブサイトの最適化を図るための一つの手法で、A/Bテストがあります。 今回は、JavaScriptのsessionStorageを活用して、ランディングページのABテストを実装する方法を紹介します。 特に、 ...

2023/07/07 21:50