Jak upravujete Javascript v prohlížeči?

Hledal jsem způsob, jak upravit JavaScript v prohlížeči, jako je Firefox, za běhu a spustit jej. Firebug nám umožňuje upravovat HTML a CSS za běhu, ale JavaScript je bolest. Musím se vrátit ke zdroji a upravit to.

Nechápu, proč vývojářské nástroje prohlížeče neumožňují úpravy. Existuje způsob, jak to udělat?

[Aktualizace]:
Označena nová odpověď v roce 2015

Rychlé odkazy:

  • IE nyní poskytuje jednu z nejlepších možností pro vývoj a ladění
  • Chrome poskytuje IntelliSense při psaní JavaScriptu, což je skvělé
  • FF funguje stejně jako 2010...!

K aktualizaci existující funkce lze použít všechny tři konzoly prohlížeče (Firefox, Internet Explorer a Chrome):řekněme, že jsem měl funkci a() který dříve dělal console.log(‘a’), mohu přejít do konzole, předefinovat funkci a() jako alert('a') a spusťte jej znovu, aby se zobrazilo okno s upozorněním.

Když jsem tuto otázku položil v roce 2010, prohlížeče nebyly tak skvělé v ladění JavaScriptu a také jsem si pravděpodobně nebyl vědom toho, že funkci lze nahradit za běhu.

Odpověď

V Chrome :Otevřete Chrome DevTools -> panel Zdroje, procházejte v levém navigačním panelu nebo stiskněte Ctrl +O pro otevření souborů obsažených na stránce.

Poté můžete soubor upravit a stisknout Ctrl +S uložit změnu a zjistit, co se stane s novými kódy. Obvykle to dělám pomocí bodů zlomu .

Pokud ladíte a chcete uložit změny do místního systému souborů, můžete kliknout pravým tlačítkem na navigaci a vybrat Přidat složku do pracovního prostoru :

V takovém případě, pokud uložíte změny v DevTools, bude aktualizován i příslušný soubor ve vašem systému souborů.

Například přidám složku do pracovního prostoru, v ní je 1.js :

Poté upravím soubor JS v DevTools, změna se okamžitě aktualizuje v místním souborovém systému: