【Node.js】时钟案例(20220907)

文章目录

  • 一、时钟页面实现准备
    • HTML+CSS+JS代码
  • 二、拆分时钟文件案例
    • 1. 拆分要求和步骤分析
    • 2. 拆分实现步骤
      • 步骤1 - 导入需要的模块并创建正则表达式
      • 步骤2 - 使用 fs 模块读取需要被处理的 html 文件
      • 步骤3 - 自定义 resolveCSS 方法
      • 步骤4 - 自定义 resolveJS 方法
      • 步骤5 - 自定义 resolveHTML 方法
    • 3. 拆分注意点
  • 三、 实现时钟的Web服务器
    • 1. 核心思路
    • 2. 步骤分析
    • 3. 具体实现

一、时钟页面实现准备

  • 时钟效果图
    【Node.js】时钟案例(20220907)_第1张图片

HTML+CSS+JS代码

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>时钟首页title>
    <style>
        .box {
     
            width: 400px;
            height: 250px;
            border: 5px solid black;
            margin: 100px auto;
            line-height: 250px;
            text-align: center;
            font-size: 70px;
            font-weight: 700;
            background-color: pink;
        }
    style>
head>

<body>
    <div class="box">div>

    <script>
        setInterval(function () {
     
            function<

你可能感兴趣的:(Node.js,node.js,javascript,前端)