H5W3
当前位置:H5W3 > 其他技术问题 > 正文

无库无框架纯js小型web项目合集(中文版)

前言

前一阵子看到了大火的github项目vanillawebprojects,对其中的实现有些好奇,于是研究了写法,但是对英文有些不太熟悉的我,无法忍受这样的纯英文项目,于是花了二周时间,潜心研究了项目的实现思路,然后自己实现了这20web项目的中文版。虽然思路来源于原项目,但是很多功能我做了扩展,相信细心的人一定会发现有哪些不同之处,让我们来一一看一下吧。

表单验证

效果如下图所示:

在线示例。
github源码地址。

挑选电影座位

效果如下图所示:

在线示例。
github源码地址。

视频播放器

效果如下图所示:

在线示例。
github源码地址。

汇率计算器

效果如下图所示:

在线示例。
github源码地址。

DOM数组方法

效果如下图所示:

在线示例。
github源码地址。

弹窗与滑动菜单

效果如下图所示:

在线示例。
github源码地址。

猜单词的双人小游戏

效果如下图所示:

在线示例。
github源码地址。

查找膳食

效果如下图所示:

在线示例。
github源码地址。

费用追踪器

效果如下图所示:

在线示例。
github源码地址。

音乐播放器

效果如下图所示:

在线示例。
github源码地址。

无限滚动

效果如下图所示:

在线示例。
github源码地址。

打字游戏

效果如下图所示:

在线示例。
github源码地址。

文本阅读器

效果如下图所示:

在线示例。
github源码地址。

记忆卡片

效果如下图所示:

在线示例。
github源码地址。

歌词搜索器

效果如下图所示:

在线示例。
github源码地址。

呼吸调节器

效果如下图所示:

在线示例。
github源码地址。

打砖块小游戏

效果如下图所示:

在线示例。
github源码地址。

新年倒计时

效果如下图所示:

在线示例。
github源码地址。

拖拽排序列表

效果如下图所示:

在线示例。
github源码地址。

猜数字小游戏

效果如下图所示:

在线示例。
github源码地址。

如果有人能发现bug,欢迎提issue,如果这些项目能够帮助到您,希望您能点个star

本文地址:H5W3 » 无库无框架纯js小型web项目合集(中文版)

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址