Depurador similar a Firebug para Google Chrome

¿Hay algo como Firebug que puedas usar en Google Chrome?

Características esenciales que me gustaría:

• Inspeccionar la fuente HTML (seleccionar elementos, eliminarlos, etc.)
• verifique los valores CSS (la solución integrada es extraña, de alguna manera)

Ya hay una herramienta similar a Firebug integrada en Chrome. Simplemente haga clic derecho en cualquier lugar de una 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 puede depurar JavaScript. También realiza 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/

Firebug Lite es compatible para inspeccionar elementos HTML, estilo CSS calculado y mucho más. Como es JavaScript puro, funciona en muchos navegadores diferentes. Simplemente 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

Solo agrego 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 DOM de Google y no, no tiene todas las características de Firebug

2. Inspector es una versión 'lite' de Firebug: la interfaz no es tan buena IMO, la inspección de elementos en ambas versiones recientes ahora es torpe, pero Firebug es aún 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 me apesta.

3. La vista previa / modificación en vivo de DOM / CSS sigue siendo mucho mejor en Firebug; CSS calculado y la vista del modelo de caja son mejores en Firebug;

4. ¿De alguna manera es más fácil leer / usar Firebug, tal vez debido a la facilidad de navegar, manipular / modificar el 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. Las pestañas Cookies / Red son extremadamente útiles para mí en Firebug. Tal vez Chrome Inspector tiene esto ahora? La última vez que lo comprobé no lo hizo, porque Chrome se actualiza en segundo plano sin su intervención (obtiene su consentimiento por defecto como todos los buenos señores).

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 tuvo 3 años para hacer que el motor de diseño de Firefox Gecko fuera tan rápido como WebKit y no lo hicieron. Lamento decirlo sin rodeos, pero es la verdad.

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

F12

Me encantan las shortkeys

Pruebe 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/

Puede configurar este bookmarklet en su "Barra de marcadores" para que Firebug lite esté siempre disponible en el navegador Chrome / Chromium (póngalo 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);

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

jQuerify es la extensión perfecta para incrustar jQuery en Chrome Console y es tan simple como te 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 (puede invocar la consola de Chrome con Ctrl+ Shift+ j".).

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

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

https://getfirebug.com/releases/lite/chrome/

Bueno, es posible habilitar los scripts de Greasemonkey para Google Chrome, ¿tal vez haya una forma de instalar Firebug con este método? Firebug Lite también funcionaría, pero no es la misma sensación que usar el completo :(

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

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

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

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

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

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

F12 (solo en Linux y Windows)

O

Ctrl ⇧ I

( ⌥ ⌘ Isi estás en Mac)

Por favor, intente Firebug Lite para Google Chrome

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