Как «динамически» редактировать код JavaScript в отладчике Chrome? Это не для меня, поэтому у меня нет доступа к исходному файлу. Я хочу отредактировать код и посмотреть, какие эффекты они имеют на странице, в этом случае анимация не будет стоять в очереди много раз.
247
num = 5, console.log(arguments[0], num), falseдля обновления и регистрации значения внутриfooфункции.Ответы:
Вы можете использовать встроенный отладчик JavaScript в Chrome Developer Tools на вкладке «Сценарии» (в более поздних версиях это вкладка «Источники»), но изменения, которые вы применяете к коду, выражаются только в тот момент, когда выполнение проходит через них. Это означает, что изменения в коде, который не запускается после загрузки страницы, не будут иметь эффекта. В отличие, например, от изменений в коде, находящемся в обработчиках наведения мыши , которые вы можете проверить на лету.
Есть видео с мероприятия Google I / O 2010, в котором представлены другие возможности Chrome Developer Tools.
источник
Я сталкивался с этим сегодня, когда играл с чужим сайтом.
Я понял, что могу прикрепить точку останова в отладчике к некоторой строке кода перед тем, что я хочу динамически редактировать. А поскольку точки останова остаются даже после перезагрузки страницы , я смог отредактировать нужные изменения, приостановив их в точке останова, а затем продолжил загружать страницу.
Так что как быстро обойти, и если это работает с вашей ситуацией:
источник
Это то, что вы ищете:
1.- Перейдите на вкладку «Источник» и откройте файл javascript.
2.- Отредактируйте файл, щелкните его правой кнопкой мыши, и появится меню: нажмите « Сохранить» и сохраните его локально.
Чтобы просмотреть изменения или отменить изменения, щелкните правой кнопкой мыши и выберите в меню пункт « Локальные изменения ...». Вы увидите изменения в сравнении с исходным файлом, если развернете указанную временную метку.
Более подробная информация здесь: http://www.sitepoint.com/edit-source-files-in-chrome/
источник
Довольно просто, перейдите на вкладку «скрипты». И выберите нужный исходный файл и дважды щелкните любую строку, чтобы отредактировать его.
источник
Поскольку это довольно популярный вопрос, касающийся редактирования JS в реальном времени, я хочу указать на еще одну полезную опцию. Как описано в сообщении svjacob:
Вышеупомянутое решение не сработало для меня для довольно большого JS (пакет веб-пакетов - минимизированная версия 3,21 МБ, 130 тыс. Строк кода в предварительно сертифицированной версии) - Chrome упал и запросил перезагрузку страницы, которая вернула все сохраненные изменения. В этом случае можно было использовать Fiddler, где вы можете установить опцию AutoRespond для замены любого удаленного ресурса любым локальным файлом с вашего компьютера - см. Этот вопрос в SO так, чтобы получить более подробную информацию .
В моем случае мне также пришлось добавить заголовки CORS в Fiddler, чтобы успешно смоделировать ответ.
источник
Если его javascript, который запускается по нажатию кнопки, то достаточно сделать изменения в разделе «Источники»> «Источники» (в инструментах разработчика в chrome) и нажать Ctrl + S для сохранения . Я все время это делаю.
Если вы обновите страницу, ваши изменения javascript исчезнут, но Chrome все равно запомнит ваши точки останова.
источник
Теперь в Google Chrome появилась новая функция. Используя эту функцию, вы можете редактировать свой код в браузере Chrome. (Постоянное изменение кода местоположения)
Для этого нажмите F12 -> Вкладка «Источник» - (справа) -> Файловая система - там выберите местоположение кода. Затем браузер Chrome запросит у вас разрешение, после чего код станет зеленым. и вы можете изменить свой код, и он также будет отражать ваше местоположение кода (это означает, что это будет постоянное изменение)
Спасибо
источник
Как и ответ @mark, мы можем создать фрагменты в Chrome DevTools с
overrideиспользованием JavaScript по умолчанию. Наконец, мы можем увидеть, какие эффекты они оказывают на странице.источник
Вот небольшое введение в отладчик JS в Chrome, который я написал. Может быть, это поможет другим, ищущим информацию об этом: http://meeech.amihod.com/getting-started-with-javascript-debugging-in-chrome/
источник
вы можете динамически редактировать файлы javascrpit в отладчике Chrome на вкладке « Источники », однако ваши изменения будут потеряны, если вы обновите страницу, чтобы приостановить загрузку страницы перед внесением изменений, вам нужно будет установить точку останова, а затем перезагрузить страницу и отредактируйте ваши изменения и, наконец, отключите отладчик, чтобы изменения вступили в силу.
источник
Я искал способ изменить скрипт и отладить этот новый скрипт. То, как мне удалось сделать это:
Установите точку останова в первой строке скрипта, который вы хотите изменить и отладить.
Перезагрузите страницу, чтобы достичь точки останова
Вставьте новый скрипт и установите в нем желаемые точки останова.
Ctrl + s, и страница обновится, и будет достигнута точка останова в первой строке.
F8, чтобы продолжить, и теперь ваш недавно вставленный скрипт заменяет оригинальный, если не производится перенаправление и перезагрузка.
источник
Chrome DevTools имеет панель « Фрагменты кода», где вы можете создавать и редактировать код JavaScript, как в редакторе, и выполнять его. Откройте DevTools, затем выберите панель «Источники» и перейдите на вкладку «Фрагменты кода».
https://developers.google.com/web/tools/chrome-devtools/snippets
источник
Вы можете использовать «Переопределения» в Chrome, чтобы сохранить изменения javascript между загрузками страниц, даже если вы не размещаете исходный код.
источник