Drucken Konsolenmeldungen in einem Ausgabefenster auf HTML mit Javascript

Question

Ich arbeite derzeit an einer Grafik-Anwendung mit d3.js. Im Folgenden ist der Link auf die d3-Zwang gerichteten Graphen: https://bl.ocks.org/mbostock/4062045 Wenn ich erstelle ein On-Click-Ereignis für einen Knoten wie:

node.on("click", function(d){ 
      console.log(d.id); 
         }); 

Dies auch die Namen der Knoten in der Konsole der Entwickler-Tool drucken des Browsers. Allerdings muss ich ein Fenster in der HTML-Seite (ein Widget) erstellen, das diesen Wert annimmt und beim Klicken auf den Knoten ausgibt.

Gibt es eine Möglichkeit, die Konsolenausgabe auf HTML-Fenster-Widget (nur ein anderes div) zu drucken?

P.S. Es wird eine ähnliche Frage gestellt: Wie erstellt man mit TextArea eine Ausgabekonsole? Aber die Antwort ist, das Schwellwert zu bestimmen und nicht, wie man es erstellt.

Hilfe geschätzt.

Answer 1

Es ist kludsey, aber Sie könnten console.log = customLogFunc; an der Spitze Ihres Skripts schreiben.

Answer 2

Versuchen Sie ein neues Fenster via Javascript zu öffnen.

var myWindow = window.open("", "MsgWindow", "width=200, height=100"); 
myWindow.document.write(d.id); 

Answer 3

Wenn Sie die Seite direkt zu modifizieren, in Javascript können Sie:

document.getElementById(); 

und es gibt eine Menge verschiedener Selektoren Sie auf here

Dann sehen Ändern Sie den HTML-Code, den Sie nur so machen müssen:

PS: Wenn Sie verwenden jquery Sie die $ Funktion wie diese zum Beispiel verwenden können, das gleiche zu tun:

$("#example").html("test"); 

Es verwendet die CSS-Selektor so bedeutet # id.

Answer 4

Wie lynko sagte Sie console.log außer Kraft setzen können:

console.log = function (message) { 
    //prettify message here 
    $("#console_out_div").append("<p>" + message + "</p>"); 
}; 

console.log("test123"); 
console.log([1,3,4]); 
console.log({a:"test", b: 2}); 

Sie müssen nur überprüfen Sie die instanceof und typeof Variable message und die Ausgabe prettify. So etwas wie fiddle.