compile html code from input

if I have a code from an input (the user writes). something like that:

<!DOCTYPE html>



        <meta charset="utf-8">

        <title>New Webpage</title>



      more html code



how can I compile this and add this to my web page in p5.js?


  • edited May 2016

    That's an ".html" file which any browser understands the way it is.
    Here's 1 w/ a complete p5.js JS sketch. You can drag the file onto any Firefox-based browser to run it.
    You can see it online here too:
    Drag & drop any image file in order to show up in browser: :D

    <script src=> defer</script>
    <script src= defer></script>
     * Image Drop (v2.0)
     * GoToLoop (2015-Nov-25)
     * dropped-image-not-showing-in-the-draw-loop-gotfile-createimg-image
    var img;
    function setup() {
      createCanvas(800, 600).drop(gotFile);
    function draw() {
      if (img)  image(img, 0, 0, width, height);
      else      text('Drag an image file onto the canvas.', width>>1, height>>1);
    function gotFile(f) {
      if (f.type == 'image')  img = loadImage(, redraw);
      else                    println('Not an image file!');
  • compile html code from input

    The simple answer is this is an incredibly bad idea and a massive security risk. You would need to parse and sanitise all HTML input to ensure they weren't injecting potentially 'dangerous' tags - like script tags or iframes.

    Yo might be better off accepting input in a format like markdown and parsing that to HTML: it's easier for users to learn and easier to control/sanitise input... And there are already a lot of libraries out there to support it.

Sign In or Register to comment.