JavaScriptライブラリ

JavaScript フレームワーク (ライブラリ)

JavaScript での高度なプログラミング (特にブラウザーの違いの複雑な処理) は、多くの場合難しくて時間がかかります。

これらの調整に対処するために、多くの JavaScript (ヘルパー) ライブラリが登場しました。

これらの JavaScript ライブラリは、JavaScript フレームワークと呼ばれることがよくあります。

このチュートリアルでは、いくつかの人気のある JavaScript フレームワークについて学びます:

jQuery

Prototype

MooTools

これらのフレームワークはすべて、アニメーション、DOM 操作、Ajax 処理などの一般的な JavaScript タスク用の関数を提供します。

このチュートリアルでは、JavaScript プログラミングをより簡単、安全、そして楽しくするためにそれらを使い始める方法を学びます。

jQuery

jQuery は現在最も人気のある JavaScript フレームワークです。

CSS セレクターを使用して、Web ページ上の HTML 要素 (DOM オブジェクト) にアクセスして操作します。

jQuery は、コンパニオン UI (ユーザー インターフェイス) とプラグインの両方を提供します。

多くの大企業がウェブサイトで jQuery を使用しています:

Google

Microsoft

IBM

Netflix

Prototype

Prototype は、一般的な Web タスクを実行するためのシンプルな API を提供するライブラリです。

APIとはApplication Programming Interfaceの略称です。これは、HTML DOM を操作するためのプロパティとメソッドのライブラリです。

プロトタイプは、クラスと継承を提供することで JavaScript を強化します。

MooTools

MooTools は、一般的な JavaScript プログラミングを簡単にする API を提供するフレームワークでもあります。

MooTools には、いくつかの軽量エフェクトとアニメーション機能も含まれています。

その他のフレームワーク

ここでは、上記で説明されていない他のフレームワークをいくつか紹介します:

YUI - Yahoo! ユーザー インターフェイス フレームワーク。単純な JavaScript 関数から完全なインターネット ウィジェットまで、多数の関数をカバーする大規模なライブラリです。

Ext JS - リッチ インターネット アプリケーションを構築するためのカスタマイズ可能なウィジェット。

Dojo - DOM 操作、イベント、ウィジェットなどのためのツールキット。

script.aculo.us - 視覚効果とインターフェイス動作のためのオープンソース JavaScript フレームワーク。

UIZE - ウィジェット、AJAX、DOM、テンプレートなど。

CDN - コンテンツ配信ネットワーク

Web ページは常にできるだけ高速であることが望まれます。ページのサイズをできるだけ小さくし、ブラウザができるだけ多くキャッシュするようにしたいと考えています。

多くの異なる Web サイトが同じ JavaScript フレームワークを使用している場合、フレームワーク ライブラリを各 Web ページの共通の場所に配置して共有することが合理的です。

CDN (コンテンツ配信ネットワーク) はこの問題を解決します。 CDN は、共有可能なコード ベースを含むサーバーのネットワークです。

Google は、次のような一連の JavaScript ライブラリに無料の CDN を提供しています。

jQuery

Prototype

MooTools

Dojo

中国の Yahoo! Firewall (略称 Great Firewall、略称 GFW) がブロックされ、不安定になります。アクセスできないため、Baidu 静的リソースのパブリック ライブラリ: http://cdn.code.baidu.com/ を使用することをお勧めします。

フレームワークを使用する

Web ページに JavaScript フレームワークを使用することを決定する前に、まずフレームワークをテストすることが賢明です。

JavaScript フレームワークはテストが簡単です。これらをコンピューターにインストールする必要はなく、インストーラーもありません。

通常は、Web ページからライブラリ ファイルを参照するだけで済みます。

学び続ける
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script> $(document).ready(function(){ $("#hide").click(function(){ $("p").hide(); }); $("#show").click(function(){ $("p").show(); }); }); </script> </head> <body> <p>这个是使用jQuery的一个实例</p> <button id="hide">隐藏</button> <button id="show">显示</button> </body> </html>
  • おすすめコース
  • コースウェアのダウンロード
現時点ではコースウェアはダウンロードできません。現在スタッフが整理中です。今後もこのコースにもっと注目してください〜