He vinculado archivos CSS y JS a archivos HTML y estoy trabajando para crear un sitio web. Agregué un atributo onclick y asigné una función INCREMENT que solo muestra "se hizo clic en el botón".
Aquí está el fragmento de código: -
También puedes ejecutarlo...
// js script function increment() { console.log("The button was clicked"); } /* CSS code*/ body{ background-image: url("station.jpg"); background-size: cover; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; font-weight: bold; text-align: center; } h1{ font-size: 60px; margin-top: 10px; margin-bottom: 10px; } h2{ font-size: 60px; margin-top: 0; margin-bottom: 20px; } button{ border: none; font-size: x-large; /* own attributes use */ padding-top: 10px; padding-bottom: 10px; color:white; font-weight: bold; width: 250px; margin-bottom: 5px; border-radius: 10px; } #increment-btn{ background:green; } #save-btn{ background: darkblue; } <!-- HTML code--> <html lang="en"> <head> <link rel="stylesheet" href="index.css"> </head> <body> <h1>People Entered:</h1> <h2 id="count-el">0</h2> <!-- Creating an increment button with id="count-el"--> <button type="button" id="increment-btn" onclick="increment()">INCREMENT</button> <script src="index.js"></script> </body> </html>Ahora mi problema es que ** cuando hago clic en el botón INCREMENTO en mi página web, no veo el resultado "se hizo clic en el botón" en mi editor de texto frente al código , simplemente dice
[Hecho] salió con código = 1 en 0.094 segundos
pero si voy a mi página web, la inspecciono y abro la consola allí, puedo ver mi mensaje "se hizo clic en el botón". ¿Es esto realmente un problema o simplemente funciona bien y el problema está en la configuración de mi código vs? ¿Estoy confundido entre las cosas aquí, porque soy realmente nuevo en esto y solo sé lo básico? Por favor, ayúdame...