Getting a variable from javascript to HTML

I am working on a little project where I am using a raspberry PI to capture video and then analyse the human pose and display it on a webpage using machine learning. I am doing this using javascript. All is good so far but now I want to replicate the human pose on a physical robot that uses servo motors.

can someone kindly help me by suggesting how I can read the value of a variable within the javascript program and send to the HTML. I can then this value to control a servo motor through the GPIO pins on the raspberry PI.

I saw "getElementById" in a few places but don’t know how it works.

Thank you in advance.

1 thought on “Getting a variable from javascript to HTML”

  1. if simply you want to read a variable value and display it on HTML, here is one of most solution:

    document.querySelector("button").addEventListener("click", function(){
      var initialPose = document.querySelector("#inputInitialPose").value;
      var displayDiv = document.querySelector("#localDisplay");
      displayDiv.innerText = initialPose;
    })
    #local{
      width: 100%;
      height: 200px;
      border: 1px solid black  
    }
    button{
      margin: 3vh;
    }
    #inputInitialPose{
      margin: 3vh;
      
    }
    
    #localDisplay{
      width: 50%;
      height: auto;
      border: 2px dotted red
    }
    <button type="submit">Display It!</button>
    <div id="local">
      <input type="number" placeholder="Insert initial Pose..." id="inputInitialPose" />
      <div id="localDisplay">
        
      </div>
    </div>
    Reply

Leave a Comment