Modifica di Javascript utilizzando gli strumenti per sviluppatori di Chrome

94

Sto cercando di modificare javascript su un sito utilizzando gli strumenti per sviluppatori di Chrome. Ho letto circa 30 resoconti su come farlo e ho guardato alcuni video. Il fatto è che quando vado alla scheda Fonti e apro il file che voglio modificare, non posso farci niente. C'è qualche passaggio che mi manca?

Posso creare punti di interruzione, passaggi, ecc ... Non riesco a modificare. Questa funzionalità è stata rimossa di recente?

javascript google-chrome web-developer-toolbar

— cooperia
fonte

1

Posso effettuare chiamate nella console senza problemi. Semplicemente non posso modificare le cose.

— cooperia

1

È possibile sovrascrivere le funzioni e le variabili locali, ma non è possibile salvare le modifiche a un file dagli strumenti di sviluppo. Hai ancora bisogno di un editor esterno per questo.

— Geuis

1

In realtà, posso modificare i file css ma non posso modificare lo script incorporato in un file php. >.>

— cooperia

1

Bene, posso fare quello che voglio con Opera. Problema risolto.

— cooperia

1

@cooperia mette il tuo codice js in un file * .js, quindi sarai in grado di modificarlo ed eseguirlo in tempo reale in chrome.

— Mahn,

102

So che questa domanda è obsoleta, ma ho appena avuto un problema simile e ho trovato la soluzione.

Se il file è stato ottimizzato, Chrome non consentirà le modifiche. L'ho spento e sono stato in grado di modificare. Disposto a scommettere che questo è / era il tuo problema.

— raddevon
fonte

4

sì, questo ha aiutato, grazie @raddevon, posso modificarli ora ma non succede alcun effetto alla pagina

— Bolas

2

Per gli altri che cercano questo argomento: avevo prettify impostato su OFF ma non riuscivo ancora a modificare. Accenderlo e spegnerlo di nuovo ha aiutato. (Grazie a IT Crowd per il consiglio;))

— Drkawashima

3

Continua: no. Risulta che ho lo stesso problema di @raddevon. Forse un bug in Chrome. Puoi modificare e salvare lo script e puoi raggiungere i punti di interruzione durante il debug. Ma lo script che è effettivamente in esecuzione è ancora la versione originale non modificata. Esempio: ho modificato lo script, commentato ogni singola riga, ma potevo ancora eseguire lo script, raggiungere i punti di interruzione sulle righe ecc. Quindi la versione modificata non è nemmeno in esecuzione, viene solo visualizzata ... Ovviamente riavvio lo script in

— molti

4

Come nota a margine se si abbellisce, quindi si copia e incolla di nuovo nel file originale, sarà un file originale pretestato che è modificabile.

— Eoin

2

@Eoin Wonderful! Questo ha totalmente funzionato. E con la funzionalità "Sostituzioni locali", funziona perfettamente. Grazie per il suggerimento :-)

— Xan-Kun Clark-Davis

52

Puoi modificare javascript negli strumenti per sviluppatori nella scheda "Fonti", MA ti consentirà di modificare javascript solo nel proprio file. Lo script incorporato in un file HTML (o PHP) rimarrà di sola lettura.

— welah
fonte

4

Sto usando Chrome su Linux e non riesco ancora a modificare il javascript anche se è un singolo file .js.

— roopunk

2

Nota leggermente interessante: l'attivazione / disattivazione di Pretty Print (l'icona "{}") abiliterà la modifica dei js incorporati, ma le modifiche non avranno effetto, quindi non è ancora quello che stiamo cercando. (Chrome 29)

— Patrick

Questo è quello che avevo bisogno di sapere. Grazie.

— geeves

29

Ha alcune limitazioni:

deve essere un file JS. non possono essere incorporati tag in una pagina html.
non può essere abbellito.

— gcb
fonte

Se dopo aver seguito la linea guida di cui sopra e le modifiche nella scheda Sorgenti non hanno effetto, prova a fare clic con il pulsante destro del mouse sul file modificato nella visualizzazione ad albero a sinistra e seleziona "Salva". Potrebbe apparire una finestra di dialogo che ti chiede di salvare un file locale, ma puoi semplicemente annullare. Solo a quel punto la cronologia delle modifiche di Chrome mostra finalmente che la modifica si è bloccata.

— Erhhung

stavo impazzendo perché questo nuovo file aveva js incorporato ma non potevo modificarlo..non capivo perché..grazie #gcb e #welah

— carinlynchin

È possibile annullare l'inclusione di un file JS dall'elenco nella Sourcesscheda degli strumenti per sviluppatori?

— techie_28

@ techie_28 non sono sicuro, apri un'altra domanda. Ma vorrei scrivere una rapida estensione per questo.

— gcb

13

Non so se hai bisogno di questo per salvare in modo permanente, ma se devi solo modificare temporaneamente il js:

Posso copiare quel javascript che voglio modificare in un editor di testo, modificarlo, quindi incollarlo nella console e ridefinirà tutte le funzioni o qualsiasi cosa che debba essere ridefinita.

ad esempio, se la pagina ha:

<script>
var foo = function() { console.log("Hi"); }
</script>

Posso prendere il contenuto tra lo script, modificarlo, quindi inserirlo nel debugger come:

foo = function() { console.log("DO SOMETHING DIFFERENT"); }

e funzionerà per me.

O se hai tipo,

function foo() {
    doAThing();
}

Puoi semplicemente entrare

function foo() {
    doSomethingElse();
}

e foo verrà ridefinito.

Probabilmente non è la soluzione migliore, ma funziona. Durerà finché non ricarichi la pagina.

— byronaltice
fonte

4

Ho cercato "chrome dev tool edit javascript". Questa pagina è il primo risultato di ricerca. Ma è troppo antiquato, non mi aiuta.

Sto usando Chrome 73, questa versione di Chrome ha l'opzione "Abilita sostituzioni locali". Usando la funzione, potrei modificare un javascript e potrei eseguire ed eseguire il debug.

— wafe
fonte