Не удается увидеть динамически загруженный код в инструментах разработчика Chrome 22
Когда я динамически загружаю фрагмент html, содержащий javascript через AJAX, я не вижу этот контент на вкладке source в окне инструментов разработчика в Chrome 22.0.1229.94. Говоря, я пошел сюда
https://developers.google.com/chrome-developer-tools/docs/scripts-breakpoints#js_dynamic
На этой странице показано примерное окно инструментов разработчика, устаревшее. Для загрузки динамического script есть кнопка на странице, и она не отображается на вкладке источника, когда вы делаете.
Как работа, я обнаружил, что добавление
debugger;
в script и перезагрузка приведет к паузе в динамически загружаемом коде, но, к сожалению, все номера строк выделены серым цветом, и вы не можете установить какие-либо точки останова в отладчике.
Мне что-то не хватает или что?
Спасибо,
Rob
Ответы
Ответ 1
Когда вы используете динамический код библиотеки или javascript, который вы загрузили динамически, вы можете использовать фразу
//@ sourceURL=foo.js
в начале вашего javascript-кода, который foo.js - это имя, которое ему будет присвоено. отладчик покажет его с этим именем.
Это правда в хром, и я тоже думаю в firebug.
В этом случае вы можете поместить точку останова в динамически загружаемом javascript-коде.
Ответ 2
Возможный дубликат:
Можно ли отлаживать динамическую загрузку JavaScript некоторыми отладчиками, такими как WebKit, FireBug или IE8 Developer Tool?
Не знаю, работает ли это или нет в хром (это определенно не работает для меня сейчас, может быть в прошлом).
//@ sourceURL=foo.js
Рабочее решение
Для динамически загружаемого script через ajax, который появится в вашем инструменте источника chrome, вам нужно добавить следующую строку в начале или конце (я предпочитаю) местоположение вашего файла script:
//# sourceURL=foo.js
И ваш script с именем foo.js появится на левой панели вкладки источника в раскрывающемся списке (без домена)
- > локальный - источник /src
- > (без домена) - foo.js
![введите описание изображения здесь]()
В качестве альтернативы вы можете добавить строку ниже в script в любом месте сценариев.
debugger;
В chrome вы можете использовать оператор "debugger;" для разрыва в заявлении, когда панель отладки открыта. Chrome просто игнорирует это, если панель отладки закрыта.
Это поможет остановить ваш script в режиме отладки, и вы увидите панель script в исходной (отладочной) панели с именем, таким как VM ****.
Надеюсь, что это поможет.
Ответ 3
Вы можете использовать // @sourceURL. Возможно, Chrome не поддерживает // @sourceURL для встроенных скриптов. Однако он работает на выражениях eval. В этой статье приводится более подробная информация об именах блоков eval и именах любых анонимных функций в вашем коде.
Вместо использования eval вы можете попробовать внедрить тег script или JSONP.
Варункумар Нагараджан
Ответ 4
В качестве альтернативы, чтобы исправить эту проблему, вы можете открыть инструмент разработчика в отдельном окне, щелкнув значок. Теперь перезагрузите script, и он будет отображаться на вкладке script, как и ожидалось. Я знаю, что это не решение, а работа вокруг. ![enter image description here]()