print text when button is pressed-CodePudding

A fellow noob here. I was wondering how can I make this button print something when pressed, I tried the document.write() but it prints it on a new clear page, I want it to be just like the image I attached. Any ideas :D

  <button onclick = "myVidPlayer.requestPictureInPicture()" " Id="togglePipButton" 
   >START</button>

CodePudding user response：

You could use an alert window.

alert("Hello! I am an alert box!!");

or something like this:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Alert</h2>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
  alert("I am an alert box!");
}
</script>

</body>
</html>

CodePudding user response：

If you are refering to print as write to DOM element or console use below code:

const someData = 'the_Data_You_Want_To_Print'

document.getElementById('printButton').onclick = function() {
  //print in DOM element
  document.getElementById('printHere').innerHTML = someData;
  //print on console
  console.log(someData)
};

#printHere {
  position: absolute;
  top: 15%;
  left: 6%;
  font-size: 5vw;
 }

<button id="printButton">Click Me To Print</button>

<p id="printHere"></p>