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

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

References

<li>Inserisce voci all'interno di una lista
<ol>Crea liste ordinate o numerate.
<ul>Usato per la creazione di liste non ordinate.
dirnameInvia informazioni sulla direzione di scrittura da un elemento input
<caption>Definisce didascalie all'interno di una tabella
autofocusAttiva un elemento al caricamento della pagina.

Users

Log in to search for users

Explore

Find inspiration

inserimento immagini in un testo

Esercizio 1 - 27/11

La torta della nonna es esame

informatica 13/10

Esercitazione 1

Contatti [Ufficio PCTO]

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!");