create a button in the center of the screen and when its clicked make an alert saying "you touched the button" in javascript

<!DOCTYPE html>
<html>
<head>
  <title>Button</title>
  <style>
    /* Center the button */
    body {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }
  </style>
</head>
<body>

  <button id="myButton">Click me!</button>

  <script>
    const myButton = document.getElementById('myButton');

    myButton.addEventListener('click', function() {
      alert('You touched the button');
    });
  </script>
</body>
</html>
477 chars
28 lines

Explanation:

  • We use CSS to center the button on the screen. The display, justify-content, and align-items properties are used to center the button both horizontally and vertically.
  • We create a button element with the id myButton.
  • We use JavaScript to add a click event listener to the button using addEventListener().
  • When the button is clicked, the function inside the event listener is executed and an alert box pops up with the message "You touched the button".

gistlibby LogSnag