jQuery復習

f:id:reonreon3reon:20140412033523p:plain

f:id:reonreon3reon:20140412033742p:plain

f:id:reonreon3reon:20140412033849p:plain

f:id:reonreon3reon:20140412033951p:plain
class mainの直下のitem要素

f:id:reonreon3reon:20140412034203p:plain

f:id:reonreon3reon:20140412034456p:plain
containsは要素の中身のフィルタ

f:id:reonreon3reon:20140412034749p:plain

f:id:reonreon3reon:20140412035009p:plain

f:id:reonreon3reon:20140412035147p:plain
a[href ] のように要素は囲む
=が同じ
!= はそれ以外
*=は要素に含む
^=は最初
$=は最後 と同じ要素を含む

f:id:reonreon3reon:20140412035622p:plain

f:id:reonreon3reon:20140412035631p:plain

cssで書いた要素を p 要素に付け加えれる

f:id:reonreon3reon:20140412040024p:plain
html属性を操作

f:id:reonreon3reon:20140412040049p:plain
カスタム属性を操作

f:id:reonreon3reon:20140412040336p:plain

textは文字列自体を変える
htmlはhtml部を変える

f:id:reonreon3reon:20140412040629p:plain
f:id:reonreon3reon:20140412040601p:plain
valで中身を取得っぽい

f:id:reonreon3reon:20140412040836p:plain

  • みたいなタグのテキストを作って、
    ulの次のeq(1)の前にあるものに要素を追加

    f:id:reonreon3reon:20140412041030p:plain
    insertBreforeとBeforeの書き方は違うが同じこと

    f:id:reonreon3reon:20140412041145p:plain
    子要素の最初が prepend / 最後が append

    f:id:reonreon3reon:20140412041435p:plain
    divがボックス
    hide( 800 ms ) はシュッと消える
    Fadeout( 800 ms )はファッと消える

    toggleは消えてたら出てくるし、
    出てたら消える

    f:id:reonreon3reon:20140412041656p:plain
    消えた後にアラートが出てくる、(要は、その後の処理ができる、関数を実行できる)

    f:id:reonreon3reon:20140412041829p:plain
    clickがクリックされたとき

    f:id:reonreon3reon:20140412041945p:plain
    mouseoverがmouseのカーソルがその要素の上にあるとき
    $(this)は同じ要素のことを指しているときにできる

    f:id:reonreon3reon:20140412042157p:plain
    メソッドチェーンを使ってる
    mouseoutで離れたとき、
    mousemoveはマウスが上で動いている時で、
    function( e ) の eは引数で、 e.pageX (カーソルのx軸を取る) などできる

    イベントは他にもあるので、jQueryの公式サイトを見る

    f:id:reonreon3reon:20140412042640p:plain
    これが要素で、
    f:id:reonreon3reon:20140412042706p:plain
    #nameにfocusがあたったとき、色を変える
    そのままだと元に戻らないので、blurで元に戻す(メソッドチェーン)

    changeはその要素の値が変わったときに使う

    f:id:reonreon3reon:20140412043156p:plain
    ボタンを作る

    f:id:reonreon3reon:20140412043231p:plain
    要素buttonがclickされたとき、
    変数pに、

    に text文字列が代入され、クラスも定義される.
    この要素の前に p が配置される

    普通に removeしたいが、 jQueryは一番最初に呼ばれたときに起動するもので、
    その時には vanishというクラスが出てきていないため、できない

    最初にvanishの親要素を選ぶ。
    "親要素".on ( どのような処理 , 'クラス', 処理 ) ;という感じ