2013-05-16 5 views
15

Ich möchte meinen JavaScript-Code debuggen und erfolgreich Breakpoints an den erforderlichen Stellen unter Quellen Registerkarte platzieren.Wie Sie Haltepunkte in Ihrem Inline-Javascript in Chrom hinzufügen

Allerdings bin ich auf ein Problem gestoßen, wo ich meinen Inline-Javascript-Code debuggen möchte. Haben wir eine Chrom-Debugging-Tool-Funktion, mit der ich meinen Inline-JavaScript-Code debuggen kann.

Mir geht es gut, mit Firebug auch zu Debugging-Zwecken.

PS: Mit Inline-JavaScript-Code, ich meine JS-Code innerhalb Body-Tag und in der gleichen Datei.

+1

Verwenden Sie die Anweisung 'debugger;'? –

+1

Ich möchte meinen Code zum Zweck der Fehlersuche nicht ändern, weil ich zu einem späteren Zeitpunkt auch diese Debugger-Zeilen entfernen muss. Ich denke also über eine Lösung nach, die den Browser bittet, bei Haltepunkten anzuhalten, so wie es in der Quell-Registerkarte stoppt. – sachinjain024

+0

mögliches Duplikat von [Wie setze ich einen Unterbrechungspunkt in Inline-Javascript im Google Chrome-Browser für Linux?] (Http://stackoverflow.com/questions/5156388/how-to-set-breakpoint-in-inline-javascript-in-google) -chrome-browser-for-linux) –

Antwort

38

Eine weitere Möglichkeit, die dynamische Skriptmethode verwenden kann. Chrome bietet einen einfachen Parser-Befehl, mit dem dynamisch geladene JS-Tags versehen werden können.

<script type="text/javascript"> 
[...] 
//# sourceURL=dynamicScript.js 
</script> 

Diese Linie teilt den Chrom-Debugger, der das gesamte Skript in dem Skript-Tag sollte als dynamicScript.js Datei interpretiert werden. Sie können die Datei in der Debugger-Liste finden und einfach Breakpoints einrichten oder den Code überprüfen.

Hinweis: @ ersetzt durch die # Fehler auf nicht unterstützten Browser

Breakpoints in Dynamic JavaScript

+1

Beachten Sie, dass [Nur-Link-Antworten] (http: //meta.stackoverflow.com/tags/link-only-answer/info) entmutigt, sollten SO-Antworten der Endpunkt einer Suche nach einer Lösung sein (im Gegensatz zu einem weiteren Zwischenstopp von Referenzen, die im Laufe der Zeit veralten). Bitte beachten Sie, dass Sie hier eine eigenständige Zusammenfassung hinzufügen und den Link als Referenz beibehalten. – kleopatra

+0

@fazzyx Danke für den Link. Ich stimme kleopatra auch zu, dass Antworten der Endpunkt der Suche sind. Entweder sollten Sie Ihre Antwort mit relevantem Inhalt aktualisieren oder einfach den Link in den Kommentar einfügen. – sachinjain024

+0

Danke für die Notiz. Ich habe die Antwort aktualisiert. – fazzyx

1

Ich habe die Lösung gefunden. Wir können Breakpoints auch auf Inline-Javascript setzen.

Lösung:

  • Zum Registerkarte Quelle in Werkzeug Chrom Entwickler und Sie können alle Quellen dort sehen.
  • Ihr HTML-Code wird mit ähnlichen Verzeichnis Struktur vorhanden sein, wie es in Ihrer URL verfolgt wird.
  • Und dann können Sie Ihre HTML und Ort Haltepunkt in Ihrem Inline öffnen JavaScript-Code
+1

Es ist möglich, Breakpoints zu setzen und funktioniert, aber wenn das Skript innerhalb des Template-Tags ist, ignoriert das Chrom sie einfach und wird das Script leider nicht an den Breakpoints pausieren. – Eddie

1

@blunderboy zu vermeiden Wenn Sie folgende Art von JS in Ihrem Körper-Tag enthält es wird nie in der Verzeichnisstruktur zeigen, In diesem Fall wird Ihre Lösung nicht funktionieren.

<div> 
<script src="myJSfile.js"> 
</script> 
</div> 

dies geschieht in jQuery Mobile, wo alles außerhalb einer Seite div nicht geladen wird, so dass Sie JS innerhalb der Seite div umfassen müssen.

Ich hätte die Antwort von @fazzyx als richtige Antwort markiert, denn so würde zumindest Chrome selbst die enthaltenen Dateien anzeigen.

Verwandte Themen