Opera Software
  1. Barre degli strumenti
  2. Menu
  3. Pannelli
  4. Accesso Rapido
  5. Segnalibri
  6. Widget
  7. Note
  8. Opera Link
  9. Opera Turbo
  10. Blocco dei contenuti
  11. Protezione Anti-Frode
  12. BitTorrent
  13. Modalità di visualizzazione
  14. Strumenti per gli sviluppatori
  15. Preferenze
  16. Preferenze Avanzate
  17. Skin
  18. Scorciatoie da tastiera
  19. Utilizzo del mouse
  20. Interfaccia vocale
  21. E-mail e news
  22. Feed
  23. Chat
  24. Finestre di dialogo
  25. Aggiornamenti automatici
  26. Backup di Opera

Strumenti per gli sviluppatori

Premere Pag Giù e Pag Su per spostarsi fra le diapositive

Opera include numerosi strumenti per gli sviluppatori Web, il più importante dei quali è Opera Dragonfly, un'interfaccia che permette il debug di pagine Web locali o remote.

La console per gli sviluppatori è uno strumento per analizzare e/o modificare interattivamente una pagina Web durante la fase di creazione o di debug; il visualizzatore dei sorgenti è invece uno strumento più semplice atto ad esaminare il codice sorgente di una pagina Web e ad apportarvi veloci modifiche.

Opera Dragonfly

Nota: per utilizzare Opera Dragonfly è necessario che JavaScript sia abilitato.

Opera Dragonfly è un'applicazione JavaScript che consente di effettuare il debug di pagine Web locali o remote. Per avviarla, nella barra dei menu selezionare Strumenti > Avanzate > Strumenti per gli sviluppatori. L'interfaccia di Dragonfly contiene tre schede:

Lo sviluppo di Opera Dragonfly non è ancora terminato. Per ulteriori informazioni, consultare i seguenti articoli online:

Console per gli sviluppatori

Al pari delle altre applicazioni JavaScript reperibili su Dev.Opera, la console per gli sviluppatori può essere trascinata e rilasciata in una barra degli strumenti qualsiasi di Opera. Quando viene caricata, la console appare come una piccola finestra, in primo piano rispetto alla pagina Web che si desidera analizzare, contenente cinque schede: DOM, JS, CSS, HTTP e About.

Nota: per utilizzare le applicazioni JavaScript disponibili su Dev.Opera è necessario che i pop-up siano abilitati.

La console per gli sviluppatori si apre sulla scheda DOM, contenente l'elenco contratto dei nodi afferenti a "document". Per espandere l'elenco selezionare il tasto segno di addizione (più).

Quando si fa clic su un nodo, la regione di pagina Web ad esso associata lampeggia brevemente. In alternativa, cliccando in un punto qualsiasi della pagina Web, viene visualizzato l'elenco dei nodi DOM con, in evidenza, il nodo relativo alla regione cliccata. Per individuare le varie regioni che compongono la pagina Web, tenere premuto il tasto Maiusc e spostarsi con il mouse sulla pagina.

Di seguito sono elencate le caratteristiche principali della scheda DOM:

La console di sviluppo può essere utilizzata per modificare interattivamente una pagina Web. Il tasto "Remove" della scheda DOM, ad esempio, permette di rimuovere dei nodi mentre la scheda CSS può essere utilizzata per modificare una qualsiasi proprietà CSS dopo aver cliccato sul tasto "Show rules" del foglio di stile prescelto. I risultati delle modifiche apportate vengono visualizzati istantaneamente ed è possibile esportarli per riutilizzarli in seguito.

Informazioni più dettagliate sulla console di sviluppo sono disponibili su Dev.Opera.

Visualizzatore dei sorgenti

Opera include uno strumento molto semplice per analizzare e modificare le pagine Web, il visualizzatore dei sorgenti. Per ispezionare il codice sorgente della pagina Web attiva è sufficiente cliccare su Visualizza > Sorgenti, premere Ctrl+F3 oppure cliccare con il tasto destro sulla pagina e selezionare "Sorgenti della pagina".

Il visualizzatore dei sorgenti apre una nuova scheda sulla barra delle schede ed evidenzia la sintassi del codice per una più agevole lettura. Per modificare i sorgenti di una pagina ci sono due possibilità:

  1. Salvare nella cache e visualizzare immediatamente i cambiamenti apportati cliccando su "Applica cambiamenti" o premendo Ctrl+R.
  2. Salvare il codice in una destinazione a scelta cliccando su "Salva" o premendo Ctrl+S.

Se si modifica il codice sorgente di un documento salvato localmente e si clicca su "Applica cambiamenti", le modifiche apportate vengono salvate in modo permanente.

Se si preferisce utilizzare un programma esterno per la visualizzazione e la modifica dei sorgenti, è necessario specificarlo in preferenze per i programmi.