在前端开发中，使用 Express.js 和 jQuery 可以快速创建 Web 应用。本文将详细介绍如何使用这两个工具创建一个完整的 Web 应用程序。本文的内容较为深入，对于想要学习和指导意义较大。
准备工作
在开始创建 Web 应用之前，需要安装 Node.js 和 Express.js。Node.js 是一个 JavaScript 运行环境，而 Express.js 是一个基于 Node.js 的 Web 应用程序框架。安装完 Node.js 后，可以使用以下命令安装 Express.js：
--- ------- -------
安装完成后，就可以开始创建 Web 应用程序了。
创建 Web 应用程序
首先，需要创建一个 Express.js 应用程序。可以使用以下命令：
------- -----
这个命令将创建一个名为 myapp 的应用程序。接下来，进入 myapp 目录并安装依赖：
-- ----- --- -------
完成后，可以使用以下命令启动应用程序：
--- -----
现在，应用程序已经启动并监听在端口 3000 上。可以在浏览器中访问 http://localhost:3000/，应该能够看到一个欢迎页面。
添加路由
在 Express.js 中，路由用于处理客户端请求。可以使用以下代码添加一个路由：
------------ ------------- ---- - --------------- --------- ---
这个路由将处理根路径的 GET 请求，并返回一个字符串“Hello World!”。可以在浏览器中访问 http://localhost:3000/，应该能够看到“Hello World!”。
添加静态文件
在 Web 应用程序中，通常需要使用静态文件，如 CSS、JavaScript 和图像等。可以使用以下代码将 public 目录设置为静态文件目录：
----------------------------------
这个代码将 public 目录设置为静态文件目录。可以在 public 目录下创建一个样式表文件 styles.css：
---- - ----------------- -------- -
然后，在 HTML 中添加以下代码：
--------- -----
------
------
--------- -----------
----- ---------------- -------------------
-------
------
----------- -- -- --------
-------
-------这个代码将样式表文件 styles.css 添加到 HTML 中。可以在浏览器中访问 http://localhost:3000/，应该能够看到一个带有灰色背景的欢迎页面。
添加 jQuery
在 Web 应用程序中，可以使用 jQuery 处理客户端事件和操作 DOM。可以使用以下代码将 jQuery 添加到 HTML 中：
--------- -----
------
------
--------- -----------
----- ---------------- -------------------
------- -----------------------------------------------------------
-------
------
----------- -- -- --------
-------- --- ------ -- ------ --- ---------
------- ------------------- -----------
--------
------------------------------- -
---------------- ---- --- ---- -----------
---
---------
-------
-------这个代码将 jQuery 添加到 HTML 中，并添加了一个按钮和一个段落。当按钮被点击时，段落的文本将被改变。可以在浏览器中访问 http://localhost:3000/，应该能够看到一个按钮和一个段落。
总结
本文介绍了如何使用 Express.js 和 jQuery 创建一个完整的 Web 应用程序。从创建应用程序、添加路由、添加静态文件、到添加 jQuery，都有详细的介绍和示例代码。希望本文能够对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65f7e6c2d10417a22234f1ed