Cada vez que hago clic en el botón de incremento, no muestra ningún resultado en el bloque de terminales del código VS.
Simplemente muestra el siguiente resultado "if ($?) { iniciar Firefox pEOPLEcOUNTERapp.htm }" simplemente inicie el navegador Firefox y cuando haga clic en el botón de incremento --> no hay salida
CÓDIGO HTML
<!DOCTYPE html> <html lang="en"> <head> <link rel = "stylesheet" href = "pEOPLEcOUNTERapp.css"> </head> <body> <h1> People Entered</h1> <h2 id="count-el">0</h2> <script src="pEOPLEcOUNTERapp.js"> // can write javascript </script> <button id="increment-btn" onclick="increment()">increment</button> </body> </html> function increment(){ //javascript code console.log("THE BUTTON WAS clicked") }Código JavaScript:
function increment() console.log("THE BUTTON WAS clicked") }Pruébalo así:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <script> function increment() { console.log("THE BUTTON WAS clicked"); } </script> </head> <body> <button id="increment-btn" onclick="increment()">increment</button> </body> </html>Tienes que añadir el guión al final del documento.
Esto debería funcionar (sin archivo js separado)
<!DOCTYPE html> <html lang="en"> <head> <link rel = "stylesheet" href = "pEOPLEcOUNTERapp.css"> </head> <body> <h1> People Entered</h1> <h2 id="count-el">0</h2> <script> function increment(){ console.log("THE BUTTON WAS clicked") } </script> <button id="increment-btn" onclick="increment()">increment</button> </body> </html>Parece que desea actualizar el recuento en ese elemento count-el . Si ese es el caso, debe defer la secuencia de comandos o agregar su llamada de secuencia de comandos justo antes de la etiqueta </body> para asegurarse de que el DOM se haya cargado y su secuencia de comandos pueda funcionar en esos elementos.
Este ejemplo elimina la necesidad de JS en línea. Almacena en caché los elementos y luego agrega un oyente al elemento del botón. Cuando se hace clic en eso, llama a la función de increment que actualiza el contenido de texto del elemento count-el .
const count = document.querySelector('#count-el'); const btn = document.querySelector('#increment-btn'); btn.addEventListener('click', increment, false); function increment() { count.textContent = Number(count.textContent) + 1; } <h1> People Entered</h1> <h2 id="count-el">0</h2> <button id="increment-btn">increment</button>