按下按钮时打印文本答案

【问题标题】：print text when button is pressed按下按钮时打印文本
【发布时间】：2021-11-13 23:27:12
【问题描述】：

这里的菜鸟。我想知道如何让这个按钮在按下时打印一些东西，我尝试了 document.write() 但它打印在一个新的清晰页面上，我希望它就像我附加的图像一样。任何想法：D

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

【问题讨论】：

打印到哪里？可能到 DOM 或控制台。
如果我应该正确回答您的问题，您希望按钮中的 START 文本在单击后更改吗？
是的，按钮点击后消失，并放置文字，即1行说明。

标签： javascript html css frontend

【解决方案1】：

如果您将打印称为写入 DOM 元素或控制台，请使用以下代码：

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>

【讨论】：

【解决方案2】：

您可以使用警报窗口。

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

或类似的东西：

<!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>

【讨论】：

我尝试了警报，但我希望文本是说明，而不是我可以写在警报中的内容。