今回はFirebugの利用とフェード効果を使ったサンプル
前回の第5回では,
さて,
コード中のconsole. log()
これまでの回で何度かconsole.
前回の復習として,
指定した要素をコンソール上に表示
var elements = $('p');
console.log(elements);
この上記のコードを,
これをFirebugのコンソール上で実行する場合,
この変数名だけを書いてコンソールに表示させるのは,
変数の中身を追う
console.
コード中の様々な箇所にconsole.
様々なところにconsole.
$(function(){
//elementsにP要素をjQueryオブジェクトを入れる
var elements = $('p');
//変数elementsをコンソールに表示
console.log(elements);
//P要素の数をコンソールに表示
console.log(elements.length);
//変数cをコンソールに表示(この時点ではcの中は空)
console.log(c);
//変数cに文字を入れる
var c = 'P要素のテキストを変数に代入';
//変数cをコンソールに表示
console.log(c);
//P要素の数だけ繰り返す,加算されるiも指定
elements.each(function(i){
//each()中のthisはドコを参照しているかコンソールに表示
console.log($(this));
//変数cにthisのテキストを代入
c = $(this).text();
//変数cをコンソールに表示
console.log(c);
//変数iをコンソールに表示
console.log(i);
});
});
上記のデモをFirebugで表示すると,
コンソールの表示結果
jQuery(p, p, p, p, p, p, p, p, p, p)
10
undefined
P要素のテキストを変数に代入
jQuery(p)
P要素1番目
0
jQuery(p)
P要素2番目
1
・・・以下略
サンプル8~9行目
変数cの中身が変化していることと,
結果で2行目
サンプル8~9行目
//P要素の数をコンソールに表示
console.log(elements.length);
サンプル11~15行目
結果で3行目で
サンプル11~15行目
//変数cをコンソールに表示(この時点ではcの中は空)
console.log(c);
//変数cに文字を入れる
var c = 'P要素のテキストを変数に代入';
サンプル17~31行目
each()メソッドを使って,
サンプル17~31行目
span class="comment">//P要素の数だけ繰り返す,加算されるiも指定
elements.each(function(i){
//each()中のthisはドコを参照しているかコンソールに表示
console.log($(this));
//変数cにthisのテキストを代入
c = $(this).text();
//変数cをコンソールに表示
console.log(c);
//変数iをコンソールに表示
console.log(i);
});
「.each(function(i){});」
このように,