Um executor HTML simples e fácil de usar sem nenhuma conta!!
Jogue clicando aqui
Ou jogue por DEV.to!!:
O código é público para quem quer alterar o app o código é este (não tem Copyright):
<!DOCTYPE html>
Executor de Sites
body { font-family: Arial; background:#222; color:#fff; padding:20px; }
textarea { width:100%; margin-top:10px; border-radius:6px; padding:10px; border:none; font-family:monospace; font-size:14px; }
button { margin-top:10px; padding:8px 12px; cursor:pointer; border:none; border-radius:5px; background:#00aaff; color:#000; font-weight:bold; }
iframe { width:100%; height:300px; border:1px solid #555; margin-top:10px; border-radius:6px; background:#000; }
label { display:block; margin-top:10px; }
Executor de Sites
HTML:
<h1>Olá Mundo</h1>
CSS:
h1 { color: #00ffcc; }
JS:
console.log("JS executado!");
Executar
Resultado:
function runCode(){
const html = document.getElementById("htmlArea").value;
const css = document.getElementById("cssArea").value;
const js = document.getElementById("jsArea").value;
const iframe = document.getElementById("outputFrame");
const doc = iframe.contentDocument || iframe.contentWindow.document;
doc.open();
doc.write(`
<style>${css}</style>
${html}
<script>
try { ${js} } catch(e){ console.error(e); }
<\/script>
`);
doc.close();
}
Top comments (1)
css #html #javascript #js #codepen