Для качественного дебагинга, вам понадобится браузер firefox с установленным плагином firebug. Хотя можно конечно пользоваться javascript’овскими alert’ами, но как сказал кто-то в чате - alert’ы, это для лохов ))


Итак приступим. Когда вы пишите яваскрипт, первым делом пробуйте его в фаербаговой консоли. Процесс чем-то напоминает программирование на питоне. Сначала в консоле, а потом уже вбиваем всё в файлик.



Иногда бывает нужно задебагить какой-нибудь event. Нажатие на линк например. С помощь jquery можно симулировать вызов event’ов. Но для начала, правильней будет поменять вид фаербага, для более удобной работы с консолью. Делается это нажатием на кнопочку указанной на следующем скриншоте.



после чего ваша консоль превратится в более удобную для многострочного кода.



Итак, симулируем event. Обычно это нужно для дебагинга функции в которой используется this

$("form button").bind('click', function() {

    console.log($(this).attr("name"));

    return false;

}).click()

Если в коде для вас непонятным является смысл console.log(), не стоит пугаться. Это функция firebug’а, которая выводит текст в коносль, тем самым заменяя метод дебагинга с помощью alert’ов.


Второй неотъемлемой частью дебагинга является частое комментирование строк кода. Если в вашем редакторе не предусмотрено комментирование сразу части кода, можем воспользоваться хитрым способом комментирования с помощью /* */ указателей, а расскомментируем путём комментирования самих указателей.. Лучше всего показать эту туфтологию на примере

Закомментированный блок кода

/*

$("form button").bind('click', function() {

    console.log($(this).attr("name"));

    return false;

}).click()

*/

Раскомментированный

// /*

$("form button").bind('click', function() {

    console.log($(this).attr("name"));

    return false;

}).click()

// */

Хотелось бы ещё написать о дебагинге аякс запросов, но сам ещё это не изучал. Как только выучу, сразу отпишусь.