[Ich bin neu in JS, so dass ich hoffe, dies ist nicht eine sehr dumme Frage:]:Coding und Debuggen von JavaScript-Code nur mit einem Browser

erstellen

ich folgendes erreichen wollen ein .html (mit einem script Tag) und eine leere .js Datei;
Verwenden Sie Firefox Firebug \ Chrome Inspect Tools * - nämlich die Konsole und die Debugging-Tools;
Verwenden Sie diese Tools, um JS-Code-Schnipsel zu Lernzwecken zu schreiben, und in der Lage sein, sie zu debuggen - aber ohne die Datei .js jedes Mal zu bearbeiten, wenn ich einen Fehler habe und dann die Seite usw. aktualisieren, dh ich möchte es alles im Browser (und ich denke, es bedeutet, dass es mit dem Konsolen-Tool gemacht werden würde).

* Ich habe nichts dagegen, ein anderes Werkzeug zu verwenden; Ich möchte einfach alles im Browser tun, und wenn es möglich ist, Schritt 1 zu überspringen - desto besser.

2016-10-31 HeyJude

Haben Sie versucht [JsFiddle] (https://jsfiddle.net/)? – AndreFeijo

Sie können nicht all das in jedem Browser tun –

Jsfiddle klingt wie eine gute Option für mich auch :) –

eval

Eine wirklich grundlegende Methode der Fehlersuche javascript direkt im Browser in einen Textbereich zu schreiben und sie bewerten. Beachten Sie, dass eval in JavaScript den Wert des letzten Ausdrucks in der Eingabezeichenfolge zurückgibt oder nicht definiert ist, wenn das letzte Element in der Zeichenfolge eine Variablendeklaration ist oder nichts, wenn ein Fehler auftritt.

Ich werde schließen dieses Beispiel als Starter, aber es ist Student-ware und weit davon entfernt einzigartig! Sie können Schaltflächen hinzufügen, wie Sie sie brauchen, sagen Sie den Textbereich mit einer HTML-Vorlage zu füllen und eine andere (bearbeitet) Text zu einem Popup-Fenster oder eine neue Registerkarte zu schreiben: D

HTML

<!DOCTYPE html><html><head><title>Eval</title><meta charset="utf-8"> 

<script> 
function clearAreas(){ 
    document.getElementById("source").value = ""; 
    document.getElementById("result").value = ""; 
} 
function evalSource() { 
    document.getElementById("result").value = 
    eval(document.getElementById("source").value); 
} 
</script> 
</head> 
<body style="background-color: #778899;"> 
<button type="button" onclick="clearAreas();">clear</button> 
<button type="button" onclick="evalSource()">=</button><br> 
<textarea cols="80" rows="20" id="source">type script here</textarea><br> 
<textarea cols="80" rows="5" id="result">eval result appears here</textarea> 

</body></html>

-Test

let add = (a, b) => a+b; 
add(123, 456)

Geben Sie den Code in den oberen Textbereich ein und klicken Sie auf equals. Öffnen Sie nun die Konsole, erstellen Sie einen Syntaxfehler im Code und klicken Sie erneut auf equals. Überprüfen Sie, ob die Zeilennummern, die in den Konsolenfehlermeldungen verwendet werden, den Zeilen im Textbereich entsprechen.

Quelle

2016-10-31 23:36:57 traktor53

Um ehrlich zu sein, habe ich noch nichts über eval gelernt, also kann ich immer noch nicht ganz verstehen, was du hier machst (Obwohl ich getan habe, was du vorgeschlagen hast und ich kann tatsächlich die Fehlerzeilen sehen). Wie auch immer, ich möchte etwas mehr als das, und es ist nur ein Stater. – HeyJude

Coding und Debuggen von JavaScript-Code nur mit einem Browser

Antwort

eval

Verwandte Themen