html判断输入数字的数量_20 个 JavaScript+Html+CSS 练手的小项目

前言：

最近在 GitHub 上发现了一个 vanillawebprojects[1] 开源仓库，里面收集了 20 个 JavaScript+Html+CSS的练手项目，没有使用任何框架，可以让你从基础入门到深入学习。这些项目原本是 Udemy 上 20 Web Projects With Vanilla JavaScript 课程的一部分，但是如果你已经拥有了一些基础，不妨试着看一下源码，然后模仿实现吧

1. Form Validator 表单验证

判断输入的表单字段是否合法

---

2. Movie Seat Booking 预定电影座位

一个简单的电影座位预定演示项目

---

3. Custom Video Player 定制视频播放器

一个简单的网页视频播放器

---

4. Exchange Rate Calculator 汇率计算器

计算不同货币的兑换汇率

---

5. DOM Array Methods Project DOM 数组方法

练习如何操作 DOM 数组

---

6. Menu Slider & Modal 动态菜单以及弹窗

练习如何弹出登录注册窗口，以及滑动弹出菜单

---

7. Hangman Game 字符侦探游戏

练习如何判断隐藏字符是否正确

---

8. Mealfinder App 点餐应用

简单的点餐查询应用

---

9. Expense Tracker 购物结算应用

简单的购物车结算应用

---

10. Music Player 音乐播放器

简单的网页音乐播放器

---

11. Infinite Scrolling 网页无限滚动演示

网页无限向下滚动实现

---

12. Typing Game 打字游戏

简单的打字输入游戏

---

13. Speech Text Reader 文本阅读器

文本阅读器

---

14. Memory Cards 记忆卡片

测试记忆的记忆卡片

---

15. LyricsSearch App 歌词搜索应用

网页歌词搜索器

---

16. Relaxer App 休闲呼吸应用

模拟呼吸的节奏

---

17. Breakout Game 弹跳破冰游戏

简单的网页破冰游戏

---

18. New Year Countdown 新年倒计时

网页新年倒计时

---

19. Sortable List 榜单应用

网页财富榜单

---

20. Speak Number Guessing Game 猜数字游戏

说出数字，猜测数字

---

今天我们给大家分享了，20 个 JavaScript+Html+CSS 练手小项目，大家觉得哪个最简单，哪个最复杂呢？赶紧去 Github 仓库拉取项目，码上行动吧

欢迎关注公众号：KnowHub 知识加油站！

参考资料

[1]

vanillawebprojects: https://github.com/bradtraversy/vanillawebprojects