Ошибки в JavaScript. Лишняя запятая и браузеры.
Знаете, бывают ошибки, на которых сколько не учись, все равно убьешь кучу времени. Думаю, каждый программист с ними сталкивался. На днях так «повезло» и мне.
Дело было так. Добавляю я эффекты из Scriptaculous, и, естественно, настраиваю их параметры. Все идет отлично. Эффекты работают как надо, работа кипит.
Тестирую, как обычно, в FireFox. Все прекрасно работает. Начинаю проверять в IE и Opera.
И тут возникает проблема. Один эффект не работает. Ни в какую. Причем я точно знаю, что сам эффект должен работать (использовал его раньше). Складывается впечатление, что не вызывается сама JavaScript функция.
Код был такой.
-
new Effect.Highlight(‘textBlock’, {
-
startcolor:"#DFDC00",
-
endcolor:"#FFFFFF", duration: 2,
-
queue: {position: ‘end’, scope: ‘myqueue’},
-
});
Короче, провозился я полчаса. В конце концов, до меня дошло, что лишняя запятая в конце массива с параметрами вызывает ошибку. (Эта запятая осталось случайно после экспериментов с параметрами).
Вроде бы ничего сложного. Но получается, что FireFox (с установленным плагином Firebug) исправил ошибку автоматически и даже предупреждения не вывел.
А я, естественно, начал думать, что это глюки браузеров.
Ошибка, конечно, пустяковая, но полчаса времени на ее исправление, плюс не самые приятные ощущения – это далеко не пустяк.
Может кто-то знает надежный способ отладки JavaScript кода (а заодно и CSS)?
Понравилась статья? Подпишитесь на продолжение 
!
Добавьте эту страницу в 
Опубликовано в JavaScript, Разное
Комментарии (14)
Вы можете отслеживать обсуждение записи с помощью RSS 2.0
Вы также можете оставить комментарий, или трекбек с Вашего сайта.
Оставить комментарий
Firefox и без firebug нормально работает. И не сказать, что это именно ошибка. В PHP, например, так же определения могут завершаться запятой — полезная фишка.
IE же достаточно четко говорит об ошибке (что с ним бывает не часто) — “требуется идентификатор, строка или число” с указанием строки с ошибкой.
firebug я вспомнил только потому, что он предназначен для отладки кода, а даже предупреждения не вывел.
Что касается запятой. Мне кажется, у языка должен быть четкий синтаксис. А в данном случае, если запятая стоит перед закрывающей скобкой, это можно трактовать как отсутствие параметра, как пустой параметр или как ошибку.
В общем, главная проблема в том, что браузеры обрабатывают код по-разному.
К слову, последняя версия FireBug, если включен режим “предупреждения JavaScript”, уведомляет о том, что запятая после списка элементов объекта не соответствует стандарту ECMA.
Что позволяет исправить множество таких ошибок.
Спасибо!
У меня действительно оказалась довольно старая версия.
вывод - не надо экономить строчки
new Effect.Highlight(‘textBlock’, {startcolor: "#DFDC00"
,
endcolor: "#FFFFFF"
,
duration: 2
,
queue:{ position: ‘end’, scope: ‘myqueue’ }
})
мдес, отступы не сохранились…
А есть еще такой способ:
new Effect.Highlight(‘textBlock’, {
startcolor: “#DFDC00″
,endcolor: “#FFFFFF”
,duration: 2
,queue:{ position: ‘end’, scope: ‘myqueue’ }
})
То есть — запятая ставится _перед_ строчкой. В этом случае поставить лишнюю запятую сложно, а на отсутствие запятой любой браузер начнет ругаться.
Не плохо. Только, вы сами написали
‘textBlock’, {В общем я согласен, нужно сразу нормально форматировать код. Ошибка ведь возникла не из-за того, что я написал лишнюю запятую, а потому что я скопировал и вставил параметр из другого эффекта вместе с запятой. Если бы я его сразу отформатировал, то проблем бы не было.
Если вы о моем примере — то это несколько не тот случай.
Не нужно путать запятую, которая разделяет элементы объекта, и запятую в списке параметров :))
Ну, и вообще, лучший способ — это, конечно, использовать нормальный редактор (типа Аптаны), для подсветки таких вот проблем.
Вообще-то, я просто пошутил
Насчет Аптаны согласен, просто иногда удобно пользоваться чем-нибудь по-проще (Notepad++ или PsPad)
А, да, они такое не умеют.
Ну, тогда — ставить Script Debugger от майкрософта (под тот же IE). Обычно, когда он открывает ошибочную строчку, сразу понятно что не так.
(сам уже месяц ем и нахваливаю, с нашей-то js-разработкой)
Script Debugger, нужно будет попробовать.
Хотя мне не нравится IE.
К тому же Firebug (для FF) очень не плохо работает.
Увы, для отладки кода в IE ничего лучше Script Debugger не придумали.
А отлаживать код в IE нужно (не писать на сайте — “не работает в IE”, в самом деле).
И бывают случаи, в основном — связанные с различием DOM моделей и событий — которые простой проверкой синтаксиса не обойдешь…
Как пример — есть такая штука, ExtJS. В ней есть элемень — grid. Удобная штука, все хорошо, но — если элемент grid перезагрузить после того, как “несущий” элемент удален из dom дерева, то IE выдает ошибку, а FireFox и Opera вполне нормально это переносят.
Откуда вывод — отлаживать нужно именно в IE, и эту ошибку как-то поймать.
Вот тут Script Debugger очень полезен.
Отладкой приходится заниматься во всех браузерах
. А проигнорировать IE, к сожалению, можно будет очень не скоро. (Когда я последний раз смотрел статистику этого блога, его использовало примерно 60% посетителей).