jQuery はじめに

JQueryを始めるための覚書きです。

①jQueryを使用したいページのHEADタグ内に、jQueryを呼び込むためのタグを記載する

パターン：1
　　jQueryのダウンロードページから入手し、srcディレクトリ等に配置

<head>
　～
<script type="text/javascript" src="js/jquery.js"></script>
　～
</head>

パターン：2
　　CDNを利用

<head>
　～
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/x.x.x/jquery.min.js"></script>
　～
</head>

※当然インターネット接続していないと使えない

　補足：jQuery には圧縮版の Minified と、非圧縮版の Uncompressed があって、一般的には読み込みの早い圧縮版を使います。圧縮版は改行などが排除されていて、ファイル名が jquery-1.6.4.min.js のように min がついてるのがそうです。数字はバージョンを表しています。

②コードを記載する場所
　jQueryのコードは、HEDAタグ内の、jQuery本体のコードの後ろに記載すること
　※CSSを読み込む場合は、CSSのほうが上になるように

　というわけで、こんな感じの順序にする

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/style.css" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/script.js"></script>
</head>

③jQueryの基本文法

$(function(){
    $("A").B(C)
});

　　A：セレクタ　・・・divタグ等、class要素を指定するところ
　　B：メソッド　・・・Aの要素に対して処理を加える部分
　　C：パラメタ

　　「AをBする」

④サンプル

例：クリックするとhoge1の指定箇所が消えるサンプル
【HTML】

<div class="hoge1">クリックすると消えます</div>

【CSS】

.hoge1{
    color:#00FF00;
}

【JS】

$(function(){
    $(".hoge1").click(function(){
        $(this).hide()
    });
});

情シス - 雑多メモ

基本は情シス、たまに開発を担当