jQuery

jQuery

【jQuery】HTML要素のループ処理を理解しよう!

HTMLの要素に対してループ処理を行う場合は、jQueryのeachメソッドを使うことで、選択された要素の集まりに対して反復処理を実行できます。以下に具体例をいくつか紹介します。事例1: すべての<li>要素のテキストを取得リスト項目(<l...
jQuery

【jQuery】動的に属性を変更する方法

jQueryを使って動的に属性を変更する方法はいくつかあります。主に使うメソッドは、attr()やprop()です。以下に、よく使う例を示します。1. attr()を使用して属性を変更attr()メソッドは、HTML属性の値を取得したり、設...
jQuery

【jQuery】Ajax通信を利用しよう

動的なWebアプリケーション開発する際には、必須とも言えるAjax通信の解説です。ページ全体をリロードせずに必要なデータだけをやり取りすることができるので、ユーザー側の利便性が飛躍的に向上します。以下は、jQueryを使ってAjax通信を行...
jQuery

【jQuery】表示・非表示にはtoggleを利用で簡単解決

HTML要素の表示・非表示を切り替えたい場合には、toggle()メソッドを利用することで、簡単に実現することができます。toggle()メソッド:サンプルソース<!DOCTYPE html><html lang="ja"><head> <...
jQuery

【jQuery】jQueryで後から追加した要素にイベントを設定させる方法

動的に要素を追加した際に、うまくイベント発火ができない場合があるので、備忘録として記述します。jQueryで後から追加した要素にイベントを設定するには、イベントデリゲーションを使用します。on()メソッドを使って、親要素にイベントをバインド...