Antworten:
Es ist keine jQuery-Funktion, sondern eine Funktion zum Debuggen. Sie können beispielsweise etwas in der Konsole protokollieren, wenn etwas passiert. Zum Beispiel:
$('#someButton').click(function() {
console.log('#someButton was clicked');
// do something
});
Sie würden dann sehen #someButton was clicked
auf der Registerkarte "Konsole" von Firebug (oder in der Konsole eines anderen Tools - z. B. dem Webinspektor von Chrome) sehen, wann Sie auf die Schaltfläche klicken würden.
Aus bestimmten Gründen ist das Konsolenobjekt möglicherweise nicht verfügbar. Dann können Sie überprüfen, ob dies der Fall ist. Dies ist nützlich, da Sie Ihren Debugging-Code bei der Bereitstellung in der Produktion nicht entfernen müssen:
if (window.console && window.console.log) {
// console is available
}
if (console.log)
(oder sogar if (console && console.log)
) wird immer noch einen Fehler auslösen, wenn die Konsole nicht verfügbar ist. Sie sollten window.console
(wie window
garantiert) verwenden und jeweils nur eine Tiefenstufe prüfen.
Orte, an denen Sie die Konsole anzeigen können! Nur um sie alle in einer Antwort zu haben.
Feuerfuchs
(Sie können jetzt auch die in Firefox integrierten Entwicklertools Strg + Umschalt + J (Tools> Webentwickler> Fehlerkonsole) verwenden, aber Firebug ist viel besser; verwenden Sie Firebug.)
Safari und Chrome
Grundsätzlich das gleiche.
https://developers.google.com/chrome-developer-tools/docs/overview
https://developer.apple.com/technologies/safari/developer-tools.html
Internet Explorer
Vergessen Sie nicht, dass Sie Kompatibilitätsmodi verwenden können, um IE7 und IE8 in IE9 oder IE10 zu debuggen
http://msdn.microsoft.com/en-us/library/ie/gg589507(v=vs.85).aspx
http://msdn.microsoft.com/en-us/library/dd565628(v=vs.85).aspx
Wenn Sie in IE6 für IE7 auf die Konsole zugreifen müssen, verwenden Sie das Firebug Lite-Lesezeichen
http://getfirebug.com/firebuglite/ Suchen Sie nach einem stabilen Lesezeichen
http://en.wikipedia.org/wiki/Bookmarklet
Oper
http://www.opera.com/dragonfly/
iOS
Funktioniert für alle iPhones, iPod touch und iPads.
Mit iOS 6 können Sie die Konsole jetzt über Safari in OS X anzeigen, wenn Sie Ihr Gerät anschließen. Oder Sie können dies mit dem Emulator tun, indem Sie einfach ein Safari-Browserfenster öffnen und zur Registerkarte "Entwickeln" wechseln. Dort finden Sie Optionen, mit denen der Safari-Inspektor mit Ihrem Gerät kommunizieren kann.
Windows Phone, Android
Beide haben keine eingebaute Konsole und keine Lesezeichenfunktion. Wir verwenden also http://jsconsole.com/ type: listen und es gibt Ihnen ein Skript-Tag, das Sie in Ihren HTML-Code einfügen können. Von da an können Sie Ihre Konsole auf der jsconsole-Website anzeigen.
iOS und Android
Sie können auch http://html.adobe.com/edge/inspect/ verwenden, um über das praktische Browser-Plugin auf jedem Gerät auf Web Inspector-Tools und die Konsole zuzugreifen.
Ältere Browserprobleme
Zuletzt stürzen ältere Versionen des IE ab, wenn Sie console.log in Ihrem Code verwenden und die Entwicklertools nicht gleichzeitig geöffnet haben. Zum Glück ist es eine einfache Lösung. Verwenden Sie das folgende Codefragment oben in Ihrem Code:
if(!window.console){ window.console = {log: function(){} }; }
Dadurch wird überprüft, ob die Konsole vorhanden ist, und wenn nicht, wird sie auf ein Objekt mit einer aufgerufenen leeren Funktion festgelegt log
. Auf diese Weise sind window.console und window.console.log niemals wirklichundefined.
Sie können alle an der Konsole protokollierten Nachrichten anzeigen, wenn Sie ein Tool wie Firebug verwenden, um Ihren Code zu überprüfen. Angenommen, Sie tun dies:
console.log('Testing console');
Wenn Sie in Firebug auf die Konsole zugreifen (oder auf ein Tool, mit dem Sie Ihren Code überprüfen möchten), wird die Meldung angezeigt, die Sie der Funktion zum Protokollieren gegeben haben. Dies ist besonders nützlich, wenn Sie sehen möchten, ob eine Funktion ausgeführt wird oder ob eine Variable ordnungsgemäß übergeben / zugewiesen wird. Es ist eigentlich ziemlich wertvoll, um herauszufinden, was mit Ihrem Code schief gelaufen ist.
Es wird eine Protokollnachricht an die Javascript-Konsole des Browsers gesendet, z. B. Firebug oder Developer Tools (Chrome / Safari), und es wird die Zeile und Datei angezeigt, von der aus es ausgeführt wurde.
Wenn Sie ein jQuery-Objekt ausgeben, enthält es außerdem einen Verweis auf dieses Element im DOM. Wenn Sie darauf klicken, wird es auf der Registerkarte Elemente / HTML angezeigt.
Sie können verschiedene Methoden verwenden. Beachten Sie jedoch, dass Firebug geöffnet sein muss, damit es in Firefox funktioniert. Andernfalls stürzt die gesamte Seite ab. Unabhängig davon, ob es sich bei der Protokollierung um eine Variable, ein Array, ein Objekt oder ein DOM-Element handelt, erhalten Sie eine vollständige Aufschlüsselung, einschließlich des Prototyps für das Objekt (immer interessant, um einen Blick darauf zu werfen). Sie können auch beliebig viele Argumente einfügen, die durch Leerzeichen ersetzt werden.
console.log( myvar, "Logged!");
console.info( myvar, "Logged!");
console.warn( myvar, "Logged!");
console.debug(myvar, "Logged!");
console.error(myvar, "Logged!");
Diese werden für jeden Befehl mit unterschiedlichen Logos angezeigt.
Sie können auch die console.profile(profileName);
Profilerstellung für eine Funktion, ein Skript usw. starten und diese dann mit beendenconsole.profileEnd(profileName);
erstellen. Beenden Sie und es wird auf der Registerkarte "Profile" in Chrome angezeigt (mit FF nicht bekannt).
Eine vollständige Referenz finden Sie unter http://getfirebug.com/logging. Ich empfehle Ihnen, diese zu lesen.(Spuren, Gruppen, Profilerstellung, Objektinspektion).
Hoffe das hilft!
console.log("x:", x)
besser als console.log("x:" + x)
? Ist es weniger fehleranfällig, da a ,
leichter zu lesen ist als a +
?
+
streng verwendet werden, aber ich wollte zeigen, dass Sie auch Kommas in den Konsolenfunktionen verwenden können. Außerdem werden Probleme vermieden, wenn beide Variablen Ganzzahlen oder Arrays sind.
console.log("x:", x)
ist deutlich besser, denn wenn x
es sich um ein Objekt oder Array (oder etwas anderes als eine Zeichenfolge) handelt, wird es korrekt angezeigt, ohne dass es in eine Zeichenfolge konvertiert wird.
Es gibt nichts mit jQuery zu tun, und wenn Sie es verwenden möchten, rate ich Ihnen, dies zu tun
if (window.console) {
console.log("your message")
}
Sie brechen Ihren Code also nicht, wenn er nicht verfügbar ist.
Wie im Kommentar vorgeschlagen, können Sie dies auch an einer Stelle ausführen und dann console.log
wie gewohnt verwenden
if (!window.console) { window.console = { log: function(){} }; }
if(!window.console){ window.console = function(){}; }
stattdessen an einer Stelle zu arbeiten und dann console.log wie gewohnt zu verwenden.
console.log
hat nichts mit jQuery zu tun. Es handelt sich um ein allgemeines Objekt / eine Methode, die von Debuggern (einschließlich Chrome-Debugger und Firebug) bereitgestellt wird und die es einem Skript ermöglicht, Daten (oder Objekte in den meisten Fällen) in der JavaScript-Konsole zu protokollieren.
console.log
Protokolliert Debug-Informationen in einigen Browsern an der Konsole (Firefox mit installiertem Firebug, Chrome, IE8, alles mit installiertem Firebug Lite). In Firefox ist es ein sehr leistungsfähiges Tool, mit dem Sie Objekte untersuchen oder das Layout oder andere Eigenschaften von HTML-Elementen untersuchen können. Es hat nichts mit jQuery zu tun, aber es gibt zwei Dinge, die normalerweise bei der Verwendung mit jQuery ausgeführt werden:
Installieren Sie die FireQuery- Erweiterung für Firebug. Dies macht unter anderem die Protokollierung von jQuery-Objekten schöner.
Erstellen Sie einen Wrapper, der eher den Konventionen für den Verkettungscode von jQuery entspricht.
Dies bedeutet normalerweise ungefähr so:
$.fn.log = function() {
if (window.console && console.log) {
console.log(this);
}
return this;
}
die du dann gerne aufrufen kannst
$('foo.bar').find(':baz').log().hide();
zum einfachen Überprüfen in jQuery-Ketten.
Ein Punkt der Verwirrung ist manchmal, dass Sie, um eine Textnachricht zusammen mit dem Inhalt eines Ihrer Objekte mit console.log zu protokollieren, jedes der beiden als ein anderes Argument übergeben müssen. Dies bedeutet, dass Sie sie durch Kommas trennen müssen, da dies implizit die .toString()
Methode Ihres Objekts aufrufen würde, wenn Sie den Operator + zum Verketten der Ausgaben verwenden würden . Dies wird in den meisten Fällen nicht explizit überschrieben und die von implementierte Standardimplementierung Object
liefert keine nützlichen Informationen.
Beispiel für einen Versuch in der Konsole:
>>> var myObj = {foo: 'bar'}
undefined
>>> console.log('myObj is: ', myObj);
myObj is: Object { foo= "bar"}
Wenn Sie versuchen, die informative Textnachricht mit dem Inhalt des Objekts zu verknüpfen, erhalten Sie Folgendes:
>>> console.log('myObj is: ' + myObj);
myObj is: [object Object]
Denken Sie also daran, dass console.log tatsächlich so viele Argumente akzeptiert, wie Sie möchten.
Verwenden console.log
Sie diese Option, um Ihrer Seite Debugging-Informationen hinzuzufügen.
Viele Leute verwenden alert(hasNinjas)
für diesen Zweck, aber es console.log(hasNinjas)
ist einfacher, damit zu arbeiten. Wenn Sie eine Warnung verwenden, wird ein modales Dialogfeld angezeigt, das die Benutzeroberfläche blockiert.
Bearbeiten: Ich stimme Baptiste Pernet und Jan Hančič zu, dass es eine sehr gute Idee ist, zu überprüfen, ob window.console
zuerst definiert wurde, damit Ihr Code nicht kaputt geht, wenn keine Konsole verfügbar ist.
Ein Beispiel - Angenommen, Sie möchten wissen, in welcher Codezeile Sie Ihr Programm ausführen konnten (bevor es kaputt ging!), Geben Sie einfach ein
console.log("You made it to line 26. But then something went very, very wrong.")
Sie verwenden es, um JavaScript-Code entweder mit Firebug for Firefox oder mit der JavaScript-Konsole in WebKit- Browsern zu debuggen .
var variable;
console.log(variable);
Der Inhalt der Variablen wird angezeigt, auch wenn es sich um ein Array oder Objekt handelt.
Es ist ähnlich wie print_r($var);
für PHP .
if (!window.console) { window.console = { log : function() {} }; }
. Auf diese Weise können Sie vergessen, die gelegentliche Debug-Anweisung zu entfernen.
Achtung: Wenn Sie in Ihrem Produktionscode Anrufe an die Konsole senden, wird Ihre Site im Internet Explorer beschädigt. Niemals auspacken. Siehe: https://web.archive.org/web/20150908041020/blog.patspam.com/2009/the-curse-of-consolelog
In den frühen Tagen wurde das JS-Debugging über die alert()
Funktion durchgeführt - jetzt ist es eine veraltete Praxis.
Dies console.log()
ist eine Funktion, die eine Nachricht schreibt, um sich an der Debugging-Konsole anzumelden, z. B. Webkit oder Firebug. In einem Browser sehen Sie nichts auf dem Bildschirm. Es protokolliert eine Nachricht an eine Debugging-Konsole. Es ist nur in Firefox mit Firebug und in Webkit-basierten Browsern (Chrome und Safari) verfügbar. Es funktioniert nicht in allen IE-Versionen .
Das Konsolenobjekt ist eine Erweiterung des DOM.
Das console.log()
sollte nur während der Entwicklung und des Debuggens im Code verwendet werden.
Es wird als schlechte Praxis angesehen, dass jemand console.log()
die Javascript-Datei auf dem Produktionsserver belässt .
Wenn Ihr Browser das Debuggen unterstützt, können Sie die Methode console.log () verwenden, um JavaScript-Werte anzuzeigen.
Aktivieren Sie das Debuggen in Ihrem Browser mit F12und wählen Sie im Debugger-Menü "Konsole".
Konsole in JavaScript. Versuchen Sie, ein nicht funktionierendes JavaScript-Programm zu reparieren oder zu "debuggen", und üben Sie die Verwendung des Befehls console.log (). Es gibt Verknüpfungen, die Ihnen den Zugriff auf die JavaScript-Konsole erleichtern, basierend auf dem von Ihnen verwendeten Browser:
Tastaturkürzel für die Chrome-Konsole
Windows: Ctrl+ Shift+ J
Mac: Cmd+ Option+J
Tastaturkürzel für die Firefox-Konsole
Windows: Ctrl+ Shift+ K
Mac: Cmd+ Option+K
Tastaturkürzel für die Internet Explorer-Konsole
F12 Schlüssel
Tastaturkürzel für die Safari-Konsole
Cmd+ Option+C
console.log
Insbesondere ist dies eine Methode für Entwickler, um Code zu schreiben, um die Entwickler unauffällig darüber zu informieren, was der Code tut. Es kann verwendet werden, um Sie auf ein Problem aufmerksam zu machen, sollte jedoch nicht den Platz eines interaktiven Debuggers einnehmen, wenn es Zeit ist, den Code zu debuggen. Aufgrund seiner asynchronen Natur stellen die protokollierten Werte nicht unbedingt den Wert dar, als die Methode aufgerufen wurde.
Kurz gesagt: Protokollieren Sie Fehler mit console.log
(falls verfügbar) und beheben Sie die Fehler mit dem Debugger Ihrer Wahl: Firebug , WebKit Developer Tools (in Safari und Chrome integriert ), IE Developer Tools oder Visual Studio.
Ich fühle mich wirklich einfach in der Webprogrammierung, wenn ich mit dem console.log
Debuggen beginne .
var i;
Wenn ich den Wert der i
Laufzeit überprüfen möchte ..
console.log(i);
Sie können den aktuellen Wert von i
auf der Registerkarte "Konsole" von firebug überprüfen . Es wird speziell zum Debuggen verwendet.
Es wird verwendet, um sich bei der Firebug- Konsole anzumelden (alles, was Sie übergeben) . Die Hauptverwendung wäre das Debuggen Ihres JavaScript-Codes.
In Java-Skripten gibt es keine Eingabe- und Ausgabefunktionen. Zum Debuggen wird also die Methode console console.log () verwendet. Dies ist eine Methode zur Protokollierung. Es wird unter dem Konsolenprotokoll (Entwicklungstools) gedruckt.
Es ist in IE8 und darunter erst vorhanden, wenn Sie das IE-Entwicklungstool öffnen.
Dies ist nichts mit der jQuery zu tun. Das console.log()
verweist auf die Protokollfunktion des Konsolenobjekts, die Methoden zum Protokollieren von Informationen an der Konsole des Browsers bereitstellt. Diese Methoden dienen nur zu Debugging-Zwecken und sollten nicht als Grundlage für die Präsentation von Informationen für Endbenutzer dienen.