jQuery応用編

◆画像とテキストの切替

左のボタンをクリックすると、右の写真の”ALTとテキスト”部分が変わる。


html側



js側

クリックしたら、リンクの『hrefとテキスト』をイメージの『srcとALT』にいれてね。そんでもって、イメージの『ALT』をイメージしたのテキストにいれてね。の意。


※リンクのテキストは、CSSで見えなくさせる。


★＄（this）をつかうときに気をつけること。


最初に、＜a＞タグの中の＜img＞のALTをテキストにいれようとした。
が、＄（this）は、イベントが発生した要素を習得してくれるので＜a＞タグの中に
属性がないので、読み込んではくれなかった。.attrだからダメだったのかも？？



★メソッドチェーンで気をつけること

どのセレクターに対して、命令するのか、ちゃんと理解すること



画像が、ただのサムネイルでいいとき*は、もっと簡単になる。→画像切り替え
リンクタグにいれない。ｓｒｃはそのまま、ALTをテキストにいれる。
*サムネイルと、普通サイズの画像が同じ場合