Firebugを使ってみた。
使ってみたというか、前から使ってはいたんだけど
基本的に使うのは、console.logとconsole.warnのみ。
（たまにconsole.infoとかｗ）
今回、勉強ということで改めてFirebugについて勉強してみた。
そして思い知った。。。
今まで俺が使っていた機能は、氷山の一角だったということを。。
ここで便利そうだと思った機能を紹介します。
１）コンソールタブの下にあるテキストボックスには自由に
コードが書ける。（こんなのあったのって感じｗ）
ちなみに右下の赤いボタンを押すと、テキストエリアが大きくなる。
２）HTMLタブを選択肢、左上にある「変なボタン or Inspect」をクリック。
すると、ページ上の任意の場所を選択したとき、HTMLの範囲が選択され、右側のボックスの中のスタイル、レイアウト、DOMがいい感じに表示される
(Ctrl + Enterで実行）
３）CSSをブラウザ上で編集できる
４）Scriptタブを選択。Visual Studioみたいな感じでScriptをデバックできる。
（条件付ブレークポイントなるものがある。条件がを満たしたときだけブレークポイントに引っかかる。ブレイクポイントを右クリックすることにより起動）
ウォッチは糞便利！！ 絶対使う！！
５）DOMをリアルタイムで編集できる
６）ダウンロード時間や、ファイルサイズなどを計測できる
７）便利そうなconsole関数一覧
console.debug ... console.logと同じだが、行数がでる。
console.assert ... 第一引数がfalseだったときに,第二引数以降を出力する
console.trace ... 関数の呼び出し元とかを知りたい場合とかに便利そう
console.group && groupEnd ... console関数郡をまとめることができる
console.time && timeEnd ... プログラムの速度をテストするときに便利
console.profile && profileEnd ... timeより便利そう。関数ごとに速度を計測。
console.count ... きっとこの関数はよく使うはず。
$(id) IDを渡すと，そのID属性のHTML要素を返します。
$$(selector) CSSセレクタを渡すと，該当するHTMLの要素を配列で返します。
clear() Consoleタブの表示をクリアします。
inspect(object[, tabName])
渡されたオブジェクトをもっとも最適なタブで解析します。tabNameを指定すると，そのタブで解析され，そのタブによって解析できないオブジェクトの場合はもっとも最適なタブで解析されます。利用できるtabNameは「html」「css」「script」「dom」です。
keys(object) 渡されたオブジェクトの全てのプロパティ名を配列で返します。
values(object) 渡されたオブジェクトの全ての値を配列で返します。
debug(fn) 指定された関数オブジェクトの先頭にブレークポイントを設定します。
undebug(fn) 指定された関数オブジェクトの先頭のブレークポイントを解除します。
monitor(fn) 指定された関数オブジェクトの呼び出しを監視します。その関数オブジェクトの呼び出し先や関数オブジェクトに渡された引数をconsoleに表示させます。
unmonitor(fn) monitorによって監視されている関数オブジェクトの監視を解除します。
monitorEvents(object[, types]) 渡されたオブジェクトに対するイベントを監視することができます。typesに，監視対象とするイベントのタイプを指定することができます（mouse，key，等）（※1）
unmonitorEvents(object[, types]) monitorEventsによってイベントを監視されているオブジェクトのイベントの監視を解除します。（※1）
profile([title]) profileを実行してから，profileEndを実行するまでに実行された関数の解析を行います。
profileEnd() profileによる解析を停止して結果を表示します。
使用例：
$$('a[href]').filter(/dailynews\.yahoo\.co\.jp/);
＝＝＝
var topics = $x('//a').filter(/dailynews/);
for(var i = 0; i < topics.length; i++){
window.open(topics[i]); // 大量のウィンドウが開くので注意してください。
};
＝＝＝
monitorEvents(document.body, "click") ＊これはガチで便利そう！！
以上。
