JavaScript Debug Console by @Codewith.it - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

References

colspanDefinisce il numero di colonne di una cella all'interno di una tabella.
<canvas>Tag per disegnare grafica dinamica su pagine web.
<div>Crea contenitori generici o sezioni in una pagina
<hr>Inserisce una linea orizzontale
maxImposta il valore numerico o temporale massimo per un elemento input
<!doctype>Dichiara la versione del linguaggio di sviluppo della pagina

Users

Log in to search for users

Explore

Find inspiration

template 2 colonne

Programma per la salute

Primo esercizio (26/01/2914)

CAPPUCCETTO ROSSO

lezione 10 informatica

Pagina prova html

HTML

CSS

JS

terminal console

feedback

add_box New

cookie Policy

Privacy information and cookies

We use cookies or technologies for technical purposes and, with your consent, also for other purposes as specified in the cookie policy. Refusal of consent may make some functions unavailable. Read more about the privacy policy

Click on “Agree” to confirm.

<div id="consoleDiv">
  <div  id="debugDiv" >  
  </div>
<input id="cnsl" class="con-input" placeholder=">_esegui">

</div>

#consoleDiv {
  position: fixed;
  z-index: 44444;
  bottom: 100px;
  right: 0;
  left:0;
  margin:auto;
  width: 500px;
  height: auto;
  color: black;
  background-color: transparent;
}
#debugDiv {
  overflow: auto;
  max-height: 200px;
  box-shadow:0px 0px 5px #00000033;
}
.con {
  height:auto;
  padding:4px 8px;
  margin:0;
  background-color:white;
  border-bottom: 2px solid black;
  margin:1px 0;
}
.con-input {
  height:auto;
  padding:4px 8px;
  margin:0;
  width:100%;
  background-color:white;
  border-left: 2px solid black;
  margin:1px 0;
  font-family:monospace;
  text-align:right;
  
}
.con:hover {
  background-color:lightgray;
}
.con-log {
  border-left:4px solid lightgrey;
}
.con-err {
  background-color:rgb(255,61,61);
  color:white;
}
.con-info {
  border-left:4px solid lightblue;
}
.con-warn {
  border-left:4px solid orange;
}
.con-dir {
  border-left:4px solid lightgreen;
}
.con-debug {
  border-left:4px solid white;
}

var div = document.getElementById("debugDiv");
window.console.log = function(message) {
  div.insertAdjacentHTML("beforeend","<p class='con con-log'><span style='color:lightgray;'>> </span>" + message + "</p>");
};
window.console.debug = function(message) {
  div.insertAdjacentHTML("beforeend","<p class='con con-debug'>" + message + "</p>");
};
window.console.info = function(message) {
  div.insertAdjacentHTML("beforeend","<p class='con con-info'>" + message + "</p>");
};
window.console.error = function(message) {
  div.insertAdjacentHTML("beforeend","<p class='con con-err'>Error: " + message + "</p>");
};
window.console.warn = function(message) {
  div.insertAdjacentHTML("beforeend","<p class='con con-warn'>" + message + "</p>");
};
window.console.dir = function(message) {
  div.insertAdjacentHTML("beforeend","<p class='con con-dir'>" + message + "</p>");
};
window.onerror = function(message, url, line, col) {
  div.insertAdjacentHTML("beforeend","<p class='con con-err'>Error: " + message + "<br> on line " +  line + ":" + col +"</p>");
  return false;
}

var el = document.getElementById("cnsl");
el.addEventListener("keyup", function(event) {
  if (event.keyCode === 13) {
    event.preventDefault();
  	var el = document.getElementById('cnsl');
  	el && eval(el.value);
    el.value = "";
  }
});

console.log('Hello!');
console.warn("Warning!");