HTML+JS 动态网页示例：简单计算器

以下是一个基于 HTML+JS 的简单动态网页示例：

<!DOCTYPE html>
<html>
  <head>
    <meta charset='utf-8'>
    <title>动态网页示例</title>
    <style>
      /* 样式表 */
      body {
        font-family: Arial, sans-serif;
        margin: 0;
        padding: 0;
      }
      
      header {
        background-color: #333;
        color: #fff;
        padding: 10px;
      }
      
      h1 {
        margin: 0;
      }
      
      #content {
        padding: 20px;
      }
      
      #output {
        margin-top: 20px;
        padding: 10px;
        background-color: #f5f5f5;
        border: 1px solid #ccc;
      }
    </style>
  </head>
  <body>
    <header>
      <h1>动态网页示例</h1>
    </header>
    <div id='content'>
      <h2>计算器</h2>
      <p>请输入两个数字，然后点击计算按钮。</p>
      <input type='text' id='num1'>
      <input type='text' id='num2'>
      <button onclick='calculate()'>计算</button>
      <div id='output'></div>
    </div>
    <script>
      // JavaScript代码
      function calculate() {
        var num1 = parseInt(document.getElementById('num1').value);
        var num2 = parseInt(document.getElementById('num2').value);
        var result = num1 + num2;
        document.getElementById('output').innerHTML = '结果：' + result;
      }
    </script>
  </body>
</html>

这个网页包含一个简单的计算器，用户输入两个数字，点击'计算'按钮后，网页会计算这两个数字的和，并将结果显示在页面上。

这个网页由 HTML 和 JavaScript 两部分组成。HTML 部分定义了网页的结构和样式，JavaScript 部分实现了计算器的功能。通过 JavaScript 代码，当用户点击'计算'按钮时，网页会动态地更新结果。