Вопрос по javascript – Инструменты разработчика Chrome: что такое поддержка фрагментов?

76

Начиная с версии 19, веб-инспектор Chrome имеет экспериментальную функцию под названием «поддержка фрагментов». Вот как это активировать:

Open chrome:flags, enable "Developer Tools experiments", restart.

Open Web Inspector (Developer Tools), hit the settings gear icon in the lower right corner, enable "Snippets support", restart.

enable snippets support

Open the Scripts panel, click the "navigator tree" icon on the left, and find an empty Snippets tab.

snippets tab

Мой вопрос:What can I use this for? How can I populate this with snippets?

Теперь есть очень полные документы по фрагментам:developers.google.com/chrome-developer-tools/docs/… наслаждаться Paul Irish
@PaulIrish. Страница ссылки больше не содержит фрагментов. hello_amigo

Ваш Ответ

5   ответов
84

фрагменты - это многострочная консоль, итеративный рабочий процесс разработки JS и постоянное хранилище для общих помощников по отладке.

developers.google.com/chrome-developer-tools/docs/authoring-development-workflow#snippets

Some of the use-cases Snippets can help with are:

Bookmarklets - all of your bookmarklets could be stored as snippets, especially those you may wish to edit. Utilities - debugging helpers for interacting with the current page can be stored and debugged. A community-curated list of such utilities is available. Debugging - Snippets offer a multi-line console with syntax-highlighting and persistance, making it convenience for debugging code that is more than a one-liner. Monkey-patching code - code you wish to patch at runtime can be done through Snippets, although many times you can just live-edit code in the Sources tab.

snippets screenshot

Наконец, я лично собирал несколько общих фрагментов, которые вы можете включить в свой арсенал:github.com/paulirish/devtools-addons/wiki/Snippets

Для быстрого запуска отрывков, теперь вы можете сделать это. Ctrl-Shift-P для & quot; палитры команд & quot ;, затем backspace и использование! префикс, затем введите любое имя фрагмента, который вы хотите запустить.

enter image description here

Хром & lt; 3 & lt; 3 & lt; 3
@PaulIrish Или Ctrl-P, чтобы поле было пустым, и вам не нужно удалять>, Спасибо за чаевые!
@ imeVidas, это самый быстрый способ, который я знаю. Какой фрагмент вы используете так часто, вы хотите его на быстрый набор?
Интересно, ответил ли когда-нибудь Пол Ирландский на вопрос, иNOT был помечен как правильный ответ ....
Какой самый быстрый способ выполнить фрагмент? Я мог бы нажать Ctrl + Shift + I (открыть DevTools), Ctrl + P (нечеткий поиск), начать вводить имя фрагмента, ENTER (открыть фрагмент), Ctrl + ENTER (выполнить фрагмент). Я надеюсь, что я что-то упустил и есть более быстрый способ. «Панель инструментов фрагментов» в браузере было бы неплохо.
5

редактировать, сохранять и выполнять фрагменты кода JavaScript.

Эта функция теперь работает с последними сборками Chrome, но пользовательский интерфейс пока не очень хорош. Фрагментами можно управлять из контекстного меню навигатора.
3

Developer Tools experiments в моемchrome:flagsно из сафари я нашелэтот объяснение:

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

Судя по сообщению в блоге, в Safari он содержит ошибки, поэтому, возможно, Chrome еще не реализовал его.

Поддержка фрагментов в Chrome Developer Tools - совершенно другая функция.
12

знает ли он что-нибудь об этом, он тоже не был уверен, но сказал, что он еще не полностью реализован, и указал мне на средство отслеживания ошибок, я нашел головубилет и, глядя на некоторые из кода у различий есть многоFIXME: To be implemented. Комментарии.

Похоже, что до сих пор она работала хорошо, в 24.0.1287.1 канарейке
Я понял, что мне очень нравится эта функция.
Это почти сделано. Это позволяет эффективно многострочную консоль, но с сохраняемым / именуемым вводом.
Пользовательский интерфейс в настоящее время сырой. В Windows вы можете сохранять фрагменты только с помощью Ctrl + S (просто убедитесь, что фокус находится на правом окне). Тем не менее, похоже, что нет ярлыка для запуска фрагмента.
Лучший ответ по Vidar несколько ответов ниже
3

http://bgrins.github.io/devtools-snippets/

один из полезных фрагментов - «jquerify.js»; - Используя это, вы можете включить jQuery на любую страницу, если она еще не включена.

Похожие вопросы