2021年05月26日(水曜日)
JavaScriptのライブラリである「jQuery」についての勉強会を開催しました。
■概要
「jQuery」について、初めて触る方でもわかるように、
基礎の部分の説明と実践的なメソッドとその動き・書き方についての解説
■jQueryについて
JavaScriptのライブラリで、簡単に記述できるようになっている
ループの処理・変数の計算は単体ではできないので、通常のJavaScriptを組み合わせて使う
★読み込ませ方
・CDNで読み込ませる(=Web上のソースコードを読み込む)
・ファイルをダウンロードして読み込ませる
・bodyタグの終わりの方に記述する
★記述方法について
・HTMLのDOMを取得して、メソッドを実行する
・処理をまとめておいて、functionを呼び出すという書き方もできる
■よく使うDOM操作について、コードの解説と動きについて紹介
・要素にテキストを表示させる(text)
・値を取得して、他の要素に表示させる(val, text)
・CSSを書き換える(css)
・classを追加、削除する(addClass, removeClass)
・要素を表示、非表示にする(show, hide)
・要素の追加(複製)、削除(clone, appendTo, after, remove)
・動的に追加した要素でイベントを発火させたい
■今後に向けて
・動きのあるものなので、見たり触ったりするのが楽しい
・ハンズオンで何か作ってみるという勉強会も検討
■概要
「jQuery」について、初めて触る方でもわかるように、
基礎の部分の説明と実践的なメソッドとその動き・書き方についての解説
■jQueryについて
JavaScriptのライブラリで、簡単に記述できるようになっている
ループの処理・変数の計算は単体ではできないので、通常のJavaScriptを組み合わせて使う
★読み込ませ方
・CDNで読み込ませる(=Web上のソースコードを読み込む)
・ファイルをダウンロードして読み込ませる
・bodyタグの終わりの方に記述する
★記述方法について
・HTMLのDOMを取得して、メソッドを実行する
・処理をまとめておいて、functionを呼び出すという書き方もできる
■よく使うDOM操作について、コードの解説と動きについて紹介
・要素にテキストを表示させる(text)
・値を取得して、他の要素に表示させる(val, text)
・CSSを書き換える(css)
・classを追加、削除する(addClass, removeClass)
・要素を表示、非表示にする(show, hide)
・要素の追加(複製)、削除(clone, appendTo, after, remove)
・動的に追加した要素でイベントを発火させたい
■今後に向けて
・動きのあるものなので、見たり触ったりするのが楽しい
・ハンズオンで何か作ってみるという勉強会も検討