WEB制作テクニック

jQueryの使い方

jQueryとはJavaScriptライブラリの1つで、簡単に言うと
「無料で手軽に動きのあるサイトを作れるプログラミング」です。
手軽とは言っても、プログラミングの知識も少し必要なので初心者には難しいかもしれません。

入門サイトのリンクを貼っておきます。jQuery入門 (ver 1.3.1) 、もしくは最新verをご覧ください。

参考サイト（外部サイトです）
　jQuery入門
　http://www.openspc2.org/JavaScript/Ajax/jQuery_study/


ちなみにプラグインの方は比較的簡単に動きのあるページの作成が可能です。
興味のある方はWEB制作テクニックのjQuery（プラグイン）をご覧ください。



前置きが長くなりましたが、以下がjQueryの使い方です。

まずはjQuery本体を以下のサイトからダウンロードします。
http://jquery.com/

次に使用するHTMLファイルのヘッダー部分に以下の記述を追加します。
<script type="text/javascript" src="ダウンロードしたjQueryのファイル名"></script>

※以下は名前をjquery.min.jsに変更し、jsフォルダ内に入れたときの記述です。
<script type="text/javascript" src="js/jquery.min.js"></script>


以下はソースのイメージです。
  <html>
  <head>
  <script type="text/javascript" src="js/jquery.min.js"></script>
  <title>ページのタイトル</title>
  </head>
  <body>
  </body>
  </html>


もしくは


  <html>
  <head>
  <script type="text/javascript"
   src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
  <title>ページのタイトル</title>
  </head>
  <body>
  </body>
  </html>


と記述します。
1番目の場合はサーバーにjQuery本体をアップロードしてください。
2番目の場合はアップロードしなくても大丈夫ですが、オフラインでは利用できません。
実際に使用する際は、これにJavaScriptで命令を記述し、操作します。
<script type="text/javascript">ここに命令文</script>
もしくは外部ファイルの場合は
<script type="text/javascript" src="外部ファイルのあるアドレス"></script>


あくまでjQueryの準備のみを記述しました。
プラグインを使用する場合も同様のjQuery本体を読み込まないといけないのでご注意ください。


上へ