html - quantum - Depurador tipo Firebug para Google Chrome

firebug para firefox quantum

Question

¿Hay algo como Firebug que puedas usar dentro de Google Chrome?

Características esenciales que me gustaría:

• Inspeccionar fuente HTML (seleccionar elementos, eliminarlos, etc.)
• verifica los valores CSS (la solución incorporada es rara, de alguna manera)

Answer 1

Bueno, ¿es posible habilitar los scripts de Greasemonkey para Google Chrome, así que quizás haya una manera de instalar Firebug usando este método? Firebug Lite también funcionaría, pero no es lo mismo que usar la función completa :(

willshouse.com/2009/05/29/install-greasemonkey-for-chrome-a-better-guide/

Answer 2

Esto no responde a su pregunta, pero, en caso de que la haya omitido, el desarrollador web de Chris Pederick ahora está disponible para Chrome: https://chrome.google.com/extensions/detail/bfbameneiokkgbdmiekhjnmfkcnldhhm .

Answer 3

Firebug Lite admite inspeccionar elementos HTML, estilo CSS computado y mucho más. Ya que es JavaScript puro, funciona en muchos navegadores diferentes. Solo incluya el script en su fuente, o agregue el bookmarklet a su barra de marcadores para incluirlo en cualquier página con un solo clic.

http://getfirebug.com/lite.html

Answer 4

Hay una herramienta similar a Firebug ya incorporada en Chrome. Simplemente haga clic derecho en cualquier parte de la página y elija "Inspeccionar elemento" en el menú. Chrome tiene una herramienta gráfica para la depuración (como en Firebug), por lo que puedes depurar JavaScript. También hace bien la inspección de CSS e incluso puede cambiar la representación de CSS sobre la marcha.

Para obtener más información, consulte https://developers.google.com/chrome-developer-tools/

Answer 5

La extensión oficial de Firebug Chrome o puede descargar y empaquetar la extensión usted mismo.

getfirebug.com/releases/lite/chrome

Answer 6

O pruebe los scripts de usuario: http://dev.chromium.org/developers/design-documents/user-scripts

Answer 7

Olvídese de todo lo que necesita este inspector independiente del navegador, dom updater

https://goggles.webmaker.org/en-US

simplemente marque y vaya a cualquier página web y haga clic en ese marcador.

este es en realidad el proyecto de Mozilla Goggles, increíble, increíble, increíble ...

Answer 8

Por favor prueba Firebug Lite para Google Chrome

Answer 9

Prueba esto, se llama Firebug Lite y aparentemente funciona con la versión beta de Chrome.

También puede encontrarlo en: https://chrome.google.com/extensions/

Answer 10

Puede configurar este bookmarklet en su "Barra de marcadores" para tener Firebug lite siempre disponible en el navegador Chrome / Chromium (ponga esto como la URL):

javascript:var firebug=document.createElement(''script'');firebug.setAttribute(''src'',''http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'');document.body.appendChild(firebug);(function(){if(window.firebug.version){firebug.init();}else{setTimeout(arguments.callee);}})();void(firebug);

Answer 11

Si está usando Chromium en Ubuntu usando el ppa nocturno, entonces debería tener el chromium-browser-inspector

Answer 12

Solo agregando algunos puntos de conversación como alguien que usa Firebug / Chrome Inspector todos los días:

1. Al momento de escribir, solo hay un inspector de DOM de Google y no tiene todas las características de Firebug

2. Inspector es una versión "liviana" de Firebug: la interfaz no es tan buena como la de la OMI, la inspección de elementos en las dos versiones recientes ahora es torpe, pero Firebug aún es mejor; Me encuentro tratando de encontrar el amor por Chrome (ya que es una experiencia de navegador mejor y más rápida), pero para el trabajo de desarrollo, todavía es una mierda para mí.

3. La vista previa / modificación en vivo de DOM / CSS sigue siendo mucho mejor en Firebug; La vista de modelo de caja y CSS calculada es mejor en Firebug;

4. De alguna manera, es más fácil leer / usar Firebug, tal vez debido a la facilidad de navegación, manipulación / modificación del documento en varias áreas clave. Quién sabe. Estoy acostumbrado a la interfaz y creo que Chrome Inspector no es tan bueno, aunque esto es algo subjetivo, lo admito.

5. La pestaña Cookies / Net es extremadamente útil para mí en Firebug. Tal vez Chrome Inspector tiene esto ahora? La última vez que lo comprobé no lo hizo, porque Chrome se actualiza a sí mismo en segundo plano sin su intervención (obtiene su consentimiento por defecto como todos los buenos amos).

6. Último punto: el día en que Google Chrome obtiene un Firebug con todas las funciones es el día en que Firefox básicamente muere por los desarrolladores porque Firefox tenía 3 años para hacer que el motor de diseño de Firefox Gecko tan rápido como WebKit y no lo hicieron. Lamento decirlo tan bruscamente, pero es la verdad.

Verás, ahora todo el mundo quiere alejarse de Flash en lugar de jQuery motivado por la accesibilidad y la interactividad móvil (iPhone, iPad, Android) y JavaScript es "de repente" un gran problema (eso es sarcasmo), por lo que el barco ha navegado, Firefox. Y eso me pone triste, como fanático de Mozilla. Chrome es simplemente un mejor navegador hasta que Firefox actualiza su motor de JavaScript.

Answer 13

jQuerify es la extensión perfecta para incrustar jQuery en Chrome Console y es lo más simple que puedas imaginar. Esta extensión también indica si jQuery ya se ha incrustado en una página.

Esta extensión se utiliza para incrustar jQuery en cualquier página que desee. Permite usar jQuery en el shell de la consola (puedes invocar la consola Chrome con Ctrl + Shift + j ".).

Para incrustar jQuery en la pestaña seleccionada, haga clic en el botón de extensión.

Answer 14

F12 (solo en Linux y Windows)

O

Ctrl ⇧ I

( ⌥ ⌘ I si estás en Mac)

Answer 15

F12

Me encantan las teclas cortas