速習+詳細+実例 jQuery講座

jQueryの概要を「速習jQuery」で学び、APIドキュメントに沿った内容を「詳細jQuery」で学び、jQueryを利用したプログラムを「実例jQuery」で書く、jQueryの講座です。
3.4 (34 ratings)
Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
300 students enrolled
$19
$85
78% off
Take This Course
  • Lectures 169
  • Length 9 hours
  • Skill Level All Levels
  • Languages Japanese
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 3/2016 Japanese

Course Description

 このコースは、jQuery公式のAPIドキュメントの知識を網羅しています。セレクタを使ったDOM要素の操作から、イベント、エフェクト、Ajax、Deferredまでの、基礎知識から実際の利用までをカバーしています。

 このコースを習得すれば、次のような事ができるようになります。

- WebページのDOM要素の操作。

- イベントやエフェクトの登録と活用。

- Ajax、Deferredといった、通信や非同期処理の扱い。

- 実際のアプリケーションの作成を通した、jQueryの活用。

 コースで紹介されるコードは、サンプルコードとして、全てダウンロードすることができます。

‥‥‥‥‥‥‥‥‥‥

 このコースを学んだ人は、3段階の講座で、jQueryを徹底的に深く使いこなせるようになります。

 まずは「速習jQuery」で、jQueryの概要を学びます。

 次に「詳細jQuery」で、APIドキュメントに沿った内容を詳細に学びます。

 最後に「実例jQuery」で、jQueryを利用したプログラムを書けるようになります。

‥‥‥‥‥‥‥‥‥‥

 このコースは、以下のように進みます。

● イントロダクション

・開発環境の準備を行います

● 速習jQuery

・基本編(jQueryとは何か?から、セレクタの利用までを紹介)
・API編(イベント、要素の操作、横断、要素の作成、要素の追加、エフェクトを紹介)
・上級編(Ajax、Deferred、プラグインの利用を紹介)

● 詳細jQuery

・jQuery
・セレクタ(基本、位置、種類と状態)
・横断(兄弟親子、その他)
・イベント(基本、キー&マウス、汎用操作、eventオブジェクト)
・属性操作
・CSS
・縦横サイズ
・Data
・操作
・エフェクト(シンプル、上級)
・Ajax
・Deferred
・Utilities

● 実例jQuery

・ブックマークレット
・Webページ上のアプリケーション

‥‥‥‥‥‥‥‥‥‥

 jQueryは、Webページ作成でよく利用されるJavaScriptのAPIです。このシンプルでパワフルなAPIを使いこなせるようになり、Web開発のスキルをアップしましょう!

What are the requirements?

  • 事前の準備は特に必要ありません。
  • 「Google Chrome」と「Atom」エディタで、開発を進めていきます。それらの導入の仕方も解説しています。

What am I going to get from this course?

  • jQueryを使った基本的なプログラミング
  • セレクタやイベント、エフェクトを利用したWebページの操作
  • AjaxやDeferredを使った非同期の処理
  • jQueryを使った実際の利用シーンでの応用的なプログラミング
  • jQueryを使ったWebページ上のアプリケーション作成

What is the target audience?

  • jQueryについて総合的に学習したい方。
  • jQueryを深く使いこなせるようになりたい方。
  • jQueryとJavaScriptで、Webページ上のアプリケーションを作りたい方。

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

Section 1: イントロダクション
01:29

本講座の説明をおこない、おおまかなロードマップを示します。

00:23

本講座で出てくるソースコードは、本レクチャーの「ダウンロード可能なリソース」から一括してダウンロードできます。

02:57

本講座ではGoogle Chromeを利用します。導入の仕方や、開発者ツールの使い方を紹介しておきます。

01:24

UTF-8で開発を行っていきます。

02:27

何を使っても構いません。ここでは、複数のOSに対応している無料のテキストエディタであるAtomを使います。Atomのダウンロード先を紹介。フォルダをドロップで、ツリー表示。

01:01

本講座は、ある程度JavaScriptの基本文法を知っている方向けの講座です。そのため、JavaScriptの基本文法を、手軽に学ぶ方法を紹介します。

Article

Q&Aを掲載していくページです。必要に応じて、参照してください。

Section 2: 速習jQuery 基本編
00:18

本セクションの前置きです。

02:53

jQueryとは何かについて話をします。また、jQueryの公式サイトを紹介します。

01:30

jQueryの1系と2系の話をします。目的に応じて、使い分ける理由を説明します。

03:30

jQueryの読み込み方を紹介します。ファイルをダウンロードして使う方法と、CDNを利用する方法を説明します。

03:23

jQueryの処理の基点となる、DOM準備後に処理を実行するreadyの使い方と、短い書き方を紹介します。

06:49

タグ、id、class属性で、操作対象を選択する方法を紹介します。また、選択した状態が、配列として格納されている様子を示します。

08:03

Google Chromeのコンソールの機能の$と、jQueryの$について話をします。

Section 3: 速習jQuery API編
00:27

本セクションの前置きです。

03:47

clickイベントを例に、イベントへの処理の登録の仕方を学びます。

06:10

文字列の取得と設定を行う.text()、htmlの取得と設定を行う.html()、属性の取得と設定を行う.attr()、CSSの取得と設定を行う.css()を使えるようになります。また、メソッド チェーンの仕組みを理解します。

07:38

文字列の取得と設定を行う.text()、htmlの取得と設定を行う.html()、属性の取得と設定を行う.attr()、CSSの取得と設定を行う.css()を使えるようになります。また、メソッド チェーンの仕組みを理解します。その2。

04:03

1つ前の要素を選択する.prev()、1つ後の要素を選択する.next()を例にして、横断という処理の概要を学びます。

03:22

$()を利用して、DOM要素を作成します。また、作成したDOM要素を操作します。

05:25

.append()、.prepend()、.appendTo()、.prependTo()を例にして、要素の追加について学びます。

02:25

.append()、.prepend()、.appendTo()、.prependTo()を例にして、要素の追加について学びます。その2です。

04:25

.hide()、.show()、.toggle()を例にして、エフェクトの概要を学びます。

Section 4: 速習jQuery 上級編
00:17

本セクションの前置きです。

03:32

テキスト ファイルを読み込み、情報を表示します。

02:39

ローカルサーバーを簡単に立てる方法を説明します。

02:37

非同期処理を順につないでいく、Deferredの入り口を学びます。

05:24

非同期処理を順につないでいく、Deferredの入り口を学びます。その2。

07:15

非同期処理を並列実行する、whenについて学びます。

02:36

プラグインとは何かを説明し、その使い方や探し方を学びます。

Section 5: 詳細jQuery jQuery
00:19

本セクションの前置きです。

02:01

詳細jQueryの進め方について説明します。基本的に、jQueryの公式APIドキュメントの内容に沿って、話を進めていきます。

01:36

日本語で読めるAPIドキュメントを紹介しておきます。

02:25

jQueryと$について学びます。

07:12

jQueryの衝突を避けるための、jQuery.noConflict()について学びます。

Section 6: 詳細jQuery Selector セレクタ 基本
00:18

本セクションの前置きです。

01:01

まずはAPIドキュメントを俯瞰します。またセレクタが、様々な要素を選択する方法であることを理解します。

01:00

要素を利用した選択方法を学びます。

01:04

idを利用した選択方法を学びます。

00:57

クラスを利用した選択方法を学びます。

03:45

属性を利用した選択方法を学びます。

Section 7: 詳細jQuery Selector セレクタ 位置
00:17

本セクションの前置きです。

04:51

選択した要素の番号を利用した選択方法を学びます。

02:44

「先頭」を指定した、様々な選択方法を学びます。

02:24

「末尾」を指定した、様々な選択方法を学びます。

04:50

n番目を指定した選択方法を学びます。nth-~を使う方法です。

01:58

「後」を指定した、様々な選択方法を学びます。

02:14

要素の子孫や子を指定した選択方法を学びます。

Section 8: 詳細jQuery Selector セレクタ 種類と状態
00:20

本セクションの前置きです。

04:41

フォーム部品の種類を利用した、選択方法を学びます。

03:13

フォーム部品の状態を利用した、選択方法を学びます。

02:20

要素の状態を利用した、選択方法を学びます。

03:54

要素の中身の状態を利用した、選択方法を学びます。

01:09

否定を利用した、選択方法を学びます。

01:23

ヘッダー要素を指定した、選択方法を学びます。

Section 9: 詳細jQuery Traversing 横断 兄弟親子
00:20

本セクションの前置きです。

01:29

まずはAPIドキュメントを俯瞰します。また横断が、選択した要素から別の要素を選択する方法であることを理解します。

03:37

兄弟要素の横断方法を学びます。

02:47

兄弟要素の横断方法を学びます。その2。

03:00

子要素や孫要素の横断方法を学びます。

04:08

親要素や先祖要素の横断方法を学びます。

Section 10: 詳細jQuery Traversing 横断 その他
00:17

本セクションの前置きです。

03:27

現在選択している要素を、絞り込む方法を学びます。

04:16

現在選択している要素を、番号で絞り込む方法を学びます。

01:35

現在選択している要素を、否定で絞り込む方法を学びます。

02:50

現在選択している要素に、選択要素を追加する方法を学びます。

01:39

現在選択している要素の選択を破棄して、1つ前の状態にする方法を学びます。

02:17

現在選択している要素全てに対して処理を行う方法を学びます。

02:14

現在選択している要素全てに対して処理を行い、実行結果をまとめた新しいjQueryオブジェクトを生成する方法を学びます。

02:17

現在選択している要素が、条件を満たしているか判定する方法を学びます。

Section 11: 詳細jQuery Events イベント 基本
00:16

本セクションの前置きです。

00:58

まずはAPIドキュメントを俯瞰します。

01:49

イベントを起こす方法、イベントを設定する方法を学びます。イベントの設定は、イベントの種類とコールバック関数の指定で行われます。

02:16

DOMの準備完了後に、処理を行う方法を学びます。

02:44

クリック時の処理について学びます。

07:22

フォームの処理に関するイベントについて学びます。また、フォームデータのシリアライズ方法を学びます。

03:52

リサイズやスクロールのイベントについて学びます。

07:15

フォーカスやブラーといったイベントについて学びます。

Section 12: 詳細jQuery Events イベント キー&マウス
00:18

本セクションの前置きです。

08:31

キー入力に関するイベントについて学びます。

02:25

ホバー イベントについて学びます。

05:37

マウス操作に関するイベントについて学びます。

03:29

マウス操作に関するイベントについて学びます。その2。

Section 13: 詳細jQuery Events イベント 汎用操作
00:19

本セクションの前置きです。

04:04

イベントが、DOMツリーの上位に伝播していく、バブリングについて学びます。

06:34

汎用的にイベントに処理を追加する、.on()について学びます。

03:36

.off()について学びます。

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

柳井 政和, ゲーム、アプリケーション開発 書籍の執筆 Java JavaScript

2002年にクロノス・クラウン合同会社を設立。代表社員。ゲームやアプリケーションの開発、書籍や記事の執筆をおこなう。

秀和システムより「マンガでわかるJavaScript」「マンガでわかるAndroidプログラミング」「マンガでわかるJavaプログラミング」他、技術評論社より「JavaScript 仕事の現場でサッと使える! デザイン教科書」「プログラマのためのコードパズル」を出版。

2001年度のオンラインソフトウェア大賞に「めもりーくりーなー」で入賞。

Ready to start learning?
Take This Course