jqueryを改めて・・・

with コメントはまだありません

jqueryは案件で使わないことはほぼなくなりましたが、
今まではなんとなく組み合わせて使っていたので、ぼちぼちjqueryとはなんぞやということころから勉強しなおしているところです。

ちょっと前までは分厚い書籍を買っていましたが、
最近はibooksやkindleでスマートに読み込んで何百ページという情報が
簡単に管理できるのは本当に便利ですね。

数冊読み漁り、だいたい序盤はどれも書いてあることは同じですね。

$(“div.sec”) $(“p”) こんなんです。

ラップ集合とかセレクタとか言って、DOMから
特定の要素をオブジェクトとして取得するという。
さまざまなセレクト方法があり、取れない情報はないでしょう。

この辺は、すべて使いこなしてるわけではないですが、
使いたいとき調べれば問題ないので飛ばし読み。

次はメソッド、関数ですね。

ここが実は理解できていたようであまり理解できていなかった。
というのもメソッドによって引数に配列が使えたりオブジェクトが扱えたり、
無名関数やら匿名関数やらいろいろ名前がありいまいちどう使い分けるのか
理解していませんでした。また関数を変数に代入して使ったりも出来て、
汎用性が高い分、ルールがいまいち把握できてませんでした。

通常の関数は、

function hoge() {//処理}
$(“.btn”).click(hoge);
とか
$(“btn”).on(“click”, hoge)

ですけど、名無し関数は

$(“.btn”).click ( function() {
//処理
});

のお馴染みのやつですね。
まあ、外部関数は(っていうのかな?w)同じような処理が
頻繁に出てくるようであれば使いますけど、
だいたいは無名関数ですね。
var hoge = $(“.btn”).click ( function() {
//処理
});
こうやればあとで、hoge変数をよびだすだけで、
また利用できますしね。

あとはeachとかですね。これも書き方が様々あり・・・

$(“div”).each( function() {

});

とか

$.each( $(“div”), function () {

});

ですね。また、引数に配列とオブジェクトを利用でき、
配列の場合は、第一がインデックスで第二が値、
オブジェクトの場合は、第一がプロパティ名で第二が値など、
今マニュアルを見れば理解できますが、最初はなんだか
意味がわかりませんでした。。

やっぱ公式マニュアルをちゃんと見ないとダメですね。

とまあ、基本的にはセレクタと関数だけ、ある程度利用できれば、
だいたいのことはできるんですが、案件だとjqueryのプラグインを
利用して組み合わせたり、少し解析みたいなことも必要なので、
もう少し理解度を上げていかないとダメですね。

今度簡単なプラグインでも作ってみたいと思います。

Leave a Reply