Debugger simile a Firebug per Google Chrome

C'è qualcosa come Firebug che puoi usare in Google Chrome?

Caratteristiche essenziali che vorrei:

• Ispeziona l'origine HTML (seleziona gli elementi, eliminali, ecc.)
• controlla i valori CSS (la soluzione integrata è strana, in qualche modo)

Esiste uno strumento simile a Firebug già integrato in Chrome. Basta fare clic con il tasto destro in qualsiasi punto di una pagina e scegliere "Ispeziona elemento" dal menu. Chrome ha uno strumento grafico per il debug (come in Firebug), quindi puoi eseguire il debug di JavaScript. Fa anche bene l'ispezione CSS e può persino cambiare il rendering CSS al volo.

Per ulteriori informazioni, consultare https://developers.google.com/chrome-developer-tools/

Firebug Lite supporta l'ispezione di elementi HTML, lo stile CSS calcolato e molto altro. Dal momento che è puro JavaScript, funziona in molti browser diversi. Includi semplicemente lo script nella tua fonte o aggiungi il bookmarklet alla barra dei segnalibri per includerlo in qualsiasi pagina con un solo clic.

http://getfirebug.com/lite.html

Basta aggiungere alcuni punti di discussione come qualcuno che utilizza Firebug / Chrome Inspector ogni giorno:

1. Al momento in cui scrivo, c'è solo un ispettore DOM di Google e no, non ha tutte le funzionalità di Firebug

2. Inspector è una versione 'lite' di Firebug: l'interfaccia non è buona come IMO, l'ispezione degli elementi in entrambe le versioni recenti è ora goffa, ma Firebug è ancora migliore; Mi ritrovo a cercare l'amore per Chrome (poiché è un'esperienza del browser migliore e più veloce), ma per il lavoro di sviluppo, fa ancora schifo per me.

3. L'anteprima / modifica live di DOM / CSS è ancora molto migliore in Firebug; i CSS calcolati e la vista del modello box sono migliori in Firebug;

4. In qualche modo è più semplice leggere / utilizzare Firebug forse a causa della facilità di navigazione, manipolazione / modifica del documento in diverse aree chiave? Chissà. Sono abituato all'interfaccia e penso che Chrome Inspector non sia buono, anche se è una cosa soggettiva, lo ammetto.

5. La scheda Cookie / Net è estremamente utile per me in Firebug. Forse Chrome Inspector ce l'ha adesso? L'ultima volta che ho verificato non è stato possibile, perché Chrome si aggiorna in background senza il tuo intervento (ottiene il tuo consenso per impostazione predefinita come tutti i buoni signori).

6. Ultimo punto: il giorno in cui Google Chrome ottiene un Firebug completo è il giorno in cui Firefox praticamente muore per gli sviluppatori perché Firefox ha avuto 3 anni per rendere Gecko il motore di layout di Firefox più veloce di WebKit e loro no. Mi spiace dirlo senza mezzi termini, ma è la verità.

Vedi, ora tutti vogliono allontanarsi da Flash al posto di jQuery motivato dall'accessibilità e dall'interattività mobili (iPhone, iPad, Android) e JavaScript è "improvvisamente" un grosso problema (questo è sarcasmo), quindi la nave ha navigato, Firefox. E questo mi rende triste, come fanperson di Mozilla. Chrome è semplicemente un browser migliore fino a quando Firefox non aggiorna il proprio motore JavaScript.

F12

Adoro i tasti di scelta rapida

Prova questo, si chiama Firebug Lite e apparentemente funziona con la versione beta di Chrome.

Puoi trovarlo anche su: https://chrome.google.com/extensions/

Puoi impostare questo bookmarklet nella "Barra dei segnalibri" per avere Firebug Lite sempre disponibile nel browser Chrome / Chromium (inseriscilo come 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);

Oppure prova gli script utente: http://dev.chromium.org/developers/design-documents/user-scripts

jQuerify è l'estensione perfetta per incorporare jQuery in Chrome Console ed è semplice come puoi immaginare. Questa estensione indica anche se jQuery è già stato incorporato in una pagina.

Questa estensione viene utilizzata per incorporare jQuery in qualsiasi pagina desiderata. Permette di usare jQuery nella shell della console (è possibile richiamare la console di Chrome di Ctrl+ Shift+ j".).

Per incorporare jQuery nella scheda selezionata, fare clic sul pulsante di estensione.

L'estensione ufficiale di Firebug Chrome oppure è possibile scaricare e impacchettare l'estensione da soli.

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

Bene, è possibile abilitare gli script Greasemonkey per Google Chrome, quindi forse c'è un modo per installare Firebug usando questo metodo? Anche Firebug Lite funzionerebbe, ma non è proprio la stessa sensazione dell'uso di quello completo :(

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

Questo non risponde alla tua domanda ma, nel caso in cui tu lo abbia perso, lo sviluppatore Web di Chris Pederick è ora disponibile per Chrome: https://chrome.google.com/extensions/detail/bfbameneiokkgbdmiekhjnmfkcnldhhm .

Dimentica tutto ciò di cui hai bisogno, questo ispettore indipendente dal browser, dom updater

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

basta aggiungere un segnalibro e andare a qualsiasi pagina Web e fare clic su quel segnalibro.

questo è in realtà il progetto Mozilla Goggles, incredibile incredibile incredibile ...

F12 (solo su Linux e Windows)

O

Ctrl ⇧ I

( ⌥ ⌘ Ise sei su Mac)

Prova Firebug Lite per Google Chrome

Se stai usando Chromium su Ubuntu usando il ppa notturno, allora dovresti avere chromium-browser-inspector