Есть ли что-то вроде Firebug для IE (для отладки JavaScript)?

Я пытаюсь исправить некоторые ошибки JavaScript. Firebug значительно упрощает отладку этих проблем при работе в Firefox, но что делать, если код работает нормально в Firefox, но IE жалуется?


person Cristian    schedule 12.08.2008    source источник
comment
См. также Инструменты устранения неполадок JavaScript в IE, аналогичный вопрос, который был задан недавно.   -  person Patrick McElhaney    schedule 12.08.2008


Ответы (16)


вы также можете ознакомиться с панелью инструментов разработчика IE. который не является отладчиком, но поможет вам проанализировать содержимое вашего кода.

Visual Studio поможет с отладка

Fiddler должен помочь проанализировать трафик, входящий и исходящий из вашего браузера.

person lomaxx    schedule 12.08.2008
comment
Обновлена ​​ссылка на панель инструментов разработчика IE: Microsoft .com/downloads/ru/ - person kg.; 12.11.2010
comment
Хотя это, возможно, лучшие инструменты для IE, они все еще мусор по сравнению с Firebug. Невозможность щелкнуть правой кнопкой мыши элемент и просмотреть его DOM и CSS сами по себе делает все эти инструменты почти бесполезными. - person Cerin; 24.07.2013

Вы можете попробовать Firebug Lite или использовать Visual Studio для отладки JavaScript.

person Lance Fisher    schedule 12.08.2008

Начиная с Internet Explorer 8, IE поставляется со встроенным набором инструментов для отладки, устранения неполадок и общей помощи в разработке ваших страниц/приложений. Вы можете получить доступ к этим инструментам, нажав F12 в браузере.

Вкладка HTML

Вкладка HTML позволит вам заглянуть в DOM так, как его понимает браузер. Когда вы выбираете элементы в представлении HTML, их стили будут подробно описаны справа, а отдельные правила можно включать и выключать. Вы также можете изменить правила и определить, были ли стили элемента унаследованы или назначены явно. Кроме того, вы даже можете сказать, из какого файла .css они происходят.

введите здесь описание изображения

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

Вкладка «Скрипт»

Для решения проблем с JavaScript вы можете посмотреть консоль и тег Script. Если ваш сценарий наткнется на вызов неопределенного метода, вы получите предупреждение в своей консоли. Консоль также позволяет вам запускать произвольный JavaScript на вашей странице, если вы хотите включать или выключать элементы или пытаться привязать обработчик к кнопке.

Вкладка «Сценарий» великолепна, так как она отформатирует ваш JavaScript для вас, позволит вам вставлять точки останова, выполнять вход и выход из блоков кода и отслеживать переменные с течением времени.

введите здесь описание изображения

Если вы использовали Firebug или даже Webkit Inspector, инструменты разработчика F12 в Internet Explorer 8+ должны быть вам хорошо знакомы.

person Sampson    schedule 15.05.2012
comment
если вы использовали firebug, вы будете ненавидеть проводник еще больше - person Jon; 08.10.2013
comment
@Jon Это правда, что инструменты разработчика F12 оставляли желать лучшего, но при правильном использовании они были довольно мощными. IE11 также поставляется с совершенно новым набором инструментов, которые эстетически обновляются и становятся еще более мощными, чем раньше. - person Sampson; 08.10.2013
comment
зависит от того, что вы пытаетесь сделать. Власть - это еще не все - person Jon; 09.10.2013
comment
@Jon Что вы пытаетесь сделать, что вам сложно с помощью инструментов разработчика IE11? - person Sampson; 09.10.2013
comment
IE11 еще не запущен в производство. Я использую 10, и на лету изменения CSS абсолютно ужасны - person Jon; 15.10.2013
comment
@Jon Чем конкретно ты расстроен? Позже в этом году я расскажу об инструментах для разработчиков и хотел бы узнать о вашем опыте. - person Sampson; 15.10.2013
comment
В частности, у меня была проблема css только в IE. Поэтому я хотел поэкспериментировать с css вживую, чтобы увидеть, какие правила мне следует изменить, чтобы это исправить. Это была кнопка, которая появлялась только при наведении. Стиль firebug: hover я не смог найти. Так что пришлось работать с кодом, чтобы найти классы, а css не указан как каскад, поэтому мне пришлось прокручивать весь css и, когда я его менял, наводить курсор, чтобы увидеть эффект. Но я даже не мог изменить css. А потом повторить. Пины в глазах. Я думаю, попробуйте что-то подобное на обоих и сравните себя. - person Jon; 16.10.2013
comment
получил 8.1 с IE11, и да, инструмент разработчика намного лучше. Все еще не вижу, как смотреть только при наведении, и куда делись просмотры других версий IE? Мой хак не работал в IE11, и IE11 не читает css должным образом, если сравнивать с любым другим браузером. - person Jon; 17.10.2013
comment
@Jon Вы можете просмотреть другие версии IE (помните, что это эмуляция и не всегда точная на 100%) на панели эмуляции (Ctrl+8). Что касается правильного чтения CSS, IE пытается следовать спецификациям, а не другим браузерам - если вы столкнетесь с местом, где IE неправильно интерпретирует ваш CSS, пожалуйста, дайте мне знать. Я бы с удовольствием поработал с вами над документированием этих примеров, поиском обходных путей или исправлением ошибок. - person Sampson; 19.10.2013
comment
ctrl+8 - супер спасибо. Это похоже на отличный инструмент. Просто на основании того, что css работает в других браузерах, и они также следуют правилам, вероятно, это проводник, но я могу ошибаться. Что вы делаете, чтобы задокументировать примеры неработающего проводника? - person Jon; 20.10.2013
comment
@Jon Я веб-разработчик, который любит решать проблемы совместимости между браузерами. Кроме того, я являюсь агентом пользователя IE, что означает, что я добровольно помогаю веб-разработчикам заставить их проекты работать в Internet Explorer и регулярно общаюсь с инженерами Microsoft, чтобы улучшить их продукты. - person Sampson; 28.10.2013

Firebug lite не слишком хорошо работает для меня. Панель инструментов разработчика просто недостаточно хороша. На самом деле нет отличного решения.

person EndangeredMassa    schedule 12.08.2008


Взгляните на DebugBar. Лицензия бесплатна для личного использования

person Christian Hagelid    schedule 12.08.2008

Для инспектора DOM попробуйте Интернет Панель инструментов разработчика Explorer.

Для вкладки "Сеть" попробуйте Fiddler.

Для отладки Javascript попробуйте Visual Web Developer 2008 Express Edition. (Или более поздняя версия Visual Studio)

Кроме того, попробуйте DebugBar.

person SLaks    schedule 09.09.2009

Visual Studio 2008 может выполнять отладку JavaScript, вам нужно перейти в Инструменты IE-> Свойства обозревателя-> Дополнительно и снять флажок «Отключить отладку сценариев (Internet Explorer)», чтобы браузер отображал ошибки, которые он обнаруживает.

Как только вы окажетесь в Visual Studio, в вашем распоряжении будет практически весь арсенал средств отладки. Он не так интегрирован, как Firebug, но намного лучше, чем все, что у нас было раньше.

person Wally Lawless    schedule 14.08.2008

Я думаю, что лучше сначала установить аддон ie core в firefox, затем загрузить страницу с аддоном ie и нажать f12. удачи.

person f.n174    schedule 30.01.2013

Сделайте закладку на панели избранного и укажите этот адрес в качестве URL-адреса:

javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F[i+'NS']&&F.documentElement.namespaceURI;E=E?F[i+'NS'](E,'script'):F[i]('script');E[r]('id',b);E[r]('src',I+g+T);E[r](b,u);(F[e]('head')[0]||F[e]('body')[0]).appendChild(E);E=new%20Image;E[r]('src',I+L);})(document,'createElement','setAttribute','getElementsByTagName','FirebugLite','4','firebug-lite.js','releases/lite/latest/skin/xp/sprite.png','https://getfirebug.com/','#startOpened');

Затем перейдите на нужную страницу и нажмите на ссылку. Firebug Lite будет/должен открыться...

person Jon    schedule 08.10.2013

Бета-версия IE8 поставляется с тем, что я считаю панелью инструментов IE Developer, но она кажется намного более мощной, чем в прошлый раз, когда я пробовал панель инструментов в IE7.

person Orion Edwards    schedule 12.08.2008

Я предполагаю, что этот вопрос был опубликован до того, как вышел финал IE8, согласно некоторым ответам.

В наши дни встроенные инструменты разработчика IE8 великолепны; и хотя отладка JS не так полезна, как Visual Studio, инструменты разработки в целом намного лучше, чем Firebug, на мой взгляд. Между этим и режимом браузера представления совместимости я могу справиться со всеми моими потребностями разработки IE6.

person Coxy    schedule 09.09.2009
comment
Нет, я полностью не согласен, потому что режим совместимости не работает. На работе мы пытались использовать IE9 с режимом совместимости, установленным на IE8, и он не вел себя как IE8 для наиболее важного аспекта, с которым мы имели дело. Я не думаю, что инструмент разработчика лучше, чем Firebug, но он другой. - person 7dr3am7; 02.10.2012

Я нашел решение этой проблемы, вы можете просто прикрепить этот тег к странице, которую вы пытаетесь отладить, и она откроет firebug:

<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>

Объяснение из https://getfirebug.com/firebuglite#Stable

person 7dr3am7    schedule 17.08.2012

Если вы серьезный разработчик внешнего интерфейса, протестируйте AJAX Edition:

http://www.compuware.com/application-performance-management/ajax-performance-testing.html

Это бесплатный инструмент, который позволяет пользователям понять, что вызывает проблемы с производительностью и функциональностью в современных AJAX/веб-приложениях.

person Matt Zanderigo    schedule 20.02.2013

В IE перейдите в MenuBar->Tools Выберите Инструменты отладчика Нажмите F12 и наслаждайтесь. Это далеко от Fire Bug, но подходит для быстрой помощи

person Sergey T    schedule 18.06.2013

Всегда есть способ обойти эту проблему, посмотрите видео, и вы сможете установить firebug за 2 минуты.

установите firebug на ie

Удачи

person Digital site    schedule 28.07.2013
comment
Обратите внимание, что ответы только по ссылкам не приветствуются, ответы SO должны быть конечной точкой поиска решения (в отличие от еще одной остановки ссылок, которые со временем устаревают). Пожалуйста, рассмотрите возможность добавления здесь отдельного синопсиса, оставив ссылку в качестве ссылки. - person kleopatra; 29.07.2013