セレクタと記述方式

要素を指定するにはセレクターを指定する必要があります。
セレクタの指定形式は下記の通り

$(function(){
	$("セレクタ名").jQueryの命令部分
	});

とセレクタ名を指定しておいて、ドットで区切り、
命令を記述します。jQueryの場合ほぼ全ての形式が上記の形で
書く事になりますので、この構造を覚えておきましょう。
　
　

具体的なセレクタ

上記コードの「セレクタ名」と書かれている所には何が入るのか？
下記のコードだとliという要素に対して、CSSのcolorプロパティを
赤に変更せよという形になります。

$(function(){
	$("li").css("color","red");
	});

もちろん要素だけではなくて、CSSと同じような感覚ID名、クラス名、
子要素のみだったり、グループだったり、jQuery独自のフィルターなど、
様々な範囲のセレクタ指定方法が準備されておりセレクタの指定の方法は多数あります。

海外版にはなりますが、セレクタのチートシートが便利ですので
セレクタ一覧が見たいと言う方は「jQuery Selectors | Refcardz」をどうぞ。
　

セレクタに関する役立ちそうなエントリー

jQuery を高速に使う CSS セレクタの書き方 – てっく煮ブログ
jQueryのセレクタ 基本 – ［JavaScript］All About
jQueryのセレクタを徹底マスターするのに最適！『jQuery Selectors』 – IDEA*IDEA ～ 百式管理人のライフハックブログ
　

ready関数について

通常ブラウザはソースコードの上から順番に読んでいき、
head要素内のscript要素にbody内の要素のHTMLを操作する命令を買いても
まだscriptを読み込んだ時点で、HTMLが読み込まれていないので、
命令を受け取っても指示する部分が無く、思った通りに動きません。

このready関数と言うのはHTMLが読み終わった後に命令を実行すると言う関数。
これで、head要素に命令を記述してもHTML側も全て読み終わったタイミングで、
命令が実行されます。

記述例

$(document).ready(fanction(){
	ここに命令がはいります！
	});

ready関数は省略も可能で上記のコードと同じ意味を持ちます。

$(fanction(){
	ここに命令がはいります！
	});

表示前にアラートを出したい時とかは別ですが、
アニメーションを与えたり、HTML側のデザイン要素を指定する場合が多い
jQueryのスクリプトは、ほとんどの場合、まずready関数を記述すると覚えておきましょう。

現在WEBを中心にデザイン、企画で事業を行っていますが、
毎日に追われるばかりで、最近自分自身は走り続けているだけで
メンテナンスしていないのではないかと思い、
このままえではいつか立ち止まる。行き詰まると言う不安にかられました。

まず手を入れなければならないなと考えたのが技術。

今後CSS3やHTML5の出現で、さらにコーディングといえども
多様化していき、さらにリッチなコンテンツへとWEBが
向っていくのであれば、かならずプログラム的な技術の壁に
ぶつかる事になるだろうなと思いました。

そんな手詰まりな状況を回避するために仕事をこなす意外に
勉強をするということを決めました。
当然日々の仕事で使う部分は毎日が勉強なのですが、
突っ込んで受けた仕事だけではなくて、WEBの技術をさらに
磨いていこうと思ったわけです。

WEBと一口でいってもその領域は恐ろしく広く、そして深いです。
ただ闇雲にと言う部分だとかなり遠くなってしまうので、
javascriptとAcstionScriptに絞って、勉強をしていこうと決めました。
これはどちらもデザイン的な表現やアイデアをもっとも形にしやすいもので
動きとか、アニメーションとかを制御できるものだからです。
両方とも全くできないと言うわけではないのですが、
この技術を磨く事で、今のWEBの仕事をさらに面白く、そして高いレベルの
ものを提供できるようになるのではないかと思っています。

もう一つの時間投資は体。

なんだかずっと仕事をしていて基本的にこもっているので、
時間が不規則で、会社員の時よりも相当体が衰えたと感じます。
これも一つ手を入れていかないと、この業界、頭や技術も必要ですが、
なんといっても体が資本です。もう少し体に時間と気をかけて
メンテナンスを行ないたいなと思っています。

上記は毎回心に思っては仕事に追われて消えていきました。
今回は決意的にエントリーしました。果たして続くのかどうかは
わかりませんが、頑張っていきたいと思います。

photo by Flickr Photo Download: #428 Monopoly