首页编写一个HTML页面，使用javascript的内嵌式方法，实现每次单击按钮使数字加一

编写一个HTML页面，使用javascript的内嵌式方法，实现每次单击按钮使数字加一

时间: 2024-11-22 11:34:37 浏览: 13

要编写一个简单的HTML页面，使用JavaScript实现点击按钮使数字动态增加，你可以按照以下步骤操作：首先，创建一个基本的HTML结构，包含一个按钮和一个用于显示数字的段落元素： ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>点击加一</title> <style> #display { margin-bottom: 10px; } </style> </head> <body> <button onclick="increaseNumber()">点击加一</button> <p id="display">初始值: 0</p> <script> // JavaScript 代码将放在这里 </script> </body> </html> ``` 接下来，在`<script>`标签内编写JavaScript函数`increaseNumber()`，该函数会在每次点击按钮时更新数字： ```javascript <script> let num = 0; // 定义一个全局变量存储当前数字 function increaseNumber() { num++; // 每次点击增加1 document.getElementById('display').innerText = `当前值: ${num}`; // 更新显示的数字 } </script> ``` 现在，当你在浏览器中打开这个HTML文件，并点击按钮时，数字会递增并实时显示在页面上。

阅读全文