20 个使用原生 JavaScript 实现的 Web 项目

20 vanilla JavaScript Web Projects

https://github.com/learning-js-by-reading-source-codes/vanillawebprojects

目录

# 项目 在线演示
01 Form Validator / 表单验证器 在线演示
02 Movie Seat Booking / 电影座位预订 在线演示
03 Custom Video Player / 自定义视频播放器 在线演示
04 Exchange Rate Calculator / 汇率计算器 在线演示
05 DOM Array Methods Project / DOM 数组方法项目 在线演示
06 Menu Slider & Modal / 滑块菜单栏和模态框 在线演示
07 Hangman Game / Hangman 游戏 在线演示
08 Mealfinder App / 餐食查找器应用程序 在线演示
09 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 / 讲数字猜谜游戏 在线演示

源码分析

tags

https://github.com/learning-js-by-reading-source-codes/vanillawebprojects/tags

actions

https://github.com/learning-js-by-reading-source-codes/vanillawebprojects/actions

refs

https://vanillawebprojects.com/projects/

xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

20 个使用原生 JavaScript 实现的 Web 项目的更多相关文章

  1. 原生JavaScript技巧大收集(1~10)

    1.原生JavaScript实现字符串长度截取 01 function cutstr(str, len) { 02     var temp; 03     var icount = 0; 04    ...

  2. 原生JavaScript技巧大收集(11~20)-(终于又被我找到这篇文章了)

    11.原生JavaScript加入收藏夹 function AddFavorite(sURL, sTitle) { try { window.external.addFavorite(sURL, sT ...

  3. WEB前端工程师整理的原生JavaScript经典百例

    一.原生JavaScript实现字符串长度截取 二.原生JavaScript获取域名主机 三.原生JavaScript转义html标签 四.原生JavaScript时间日期格式替换 Date.prot ...

  4. 20个免费的 JavaScript 游戏引擎分享给开发者

    这篇文章收集了20个免费的 JavaScript 游戏引擎分享给开发者.这些游戏引擎能够帮助游戏开发人员更快速高效的开发出各种好玩的游戏. 使用 HTML5.CSS3 和 Javascript 可以帮 ...

  5. 20 款免费的 JavaScript 游戏引擎

    使用 HTML5,CSS3 和 Javascript 可以帮助面向对象开发者开发拥有各种特性的游戏,比如:3D 动画效果,Canvas,数学,颜色,声音,WebGL 等等.最明显的优势在于使用 HTM ...

  6. JavaScript权威指南--WEB浏览器中的javascript

    知识要点 1.客户端javascript window对象是所有客户端javascript特性和API的主要接入点.它表示web浏览器的一个窗口或窗体,并且可以用window表示来引用它.window ...

  7. C#构造方法(函数) C#方法重载 C#字段和属性 MUI实现上拉加载和下拉刷新 SVN常用功能介绍(二) SVN常用功能介绍(一) ASP.NET常用内置对象之——Server sql server——子查询 C#接口 字符串的本质 AJAX原生JavaScript写法

    C#构造方法(函数)   一.概括 1.通常创建一个对象的方法如图: 通过  Student tom = new Student(); 创建tom对象,这种创建实例的形式被称为构造方法. 简述:用来初 ...

  8. 原生JavaScript

    原生JavaScript 为了方便查看. 所有的js和css代码都是嵌入式直接写在html代码中 1.js的引入方式 <!DOCTYPE html> <html lang=" ...

  9. 浅谈 原生javaScript&&react 实现全局触摸按钮（附带对addeventlistener的了解）

    1.采用原生javaACript 实现全局触摸按钮 首先在控制台输出,观察事件有哪些关于触摸的字段可以使用,然后拿这些字段的数据开始来写方法. 因为要做的是全局触摸按钮,我需要拿到的是按钮时时的坐标位 ...

随机推荐

  1. Flutter--Flutter中Widget、App的生命周期

    前言 在App的开发过程中,我们通常都需要了解App以及各个页面的生命周期,方便我们在App进入前台时启动一些任务,在进入后台后暂停一些任务.同时,各个页面的生命周期也很重要,每个页面消失时要做一些内 ...

  2. h3c交换机配置ssh密码验证登录方式

    一.背景: 1.由于PC机串口不支持热插拔,请不要在交换机带电的情况下,将串口插入或者拔出PC机.当连接PC和交换机时,请先安装配置电缆的DB-9端到PC机,再连接RJ-45到交换机:在拆下时,先拔出 ...

  3. python中贪婪与非贪婪

    Python里数量词默认是贪婪的(在少数语言里也可能是默认非贪婪),总是尝试匹配尽可能多的字符: 非贪婪则相反,总是尝试匹配尽可能少的字符. 在"*","?", ...

  4. DDD领域驱动设计：仓储

    1 前置阅读 在阅读本文章之前,你可以先阅读: 什么是DDD DDD的实体.值对象.聚合根的基类和接口:设计与实现 2 什么是仓储? 仓储封装了基础设施来提供查询和持久化聚合操作. 它们集中提供常见的 ...

  5. JS 实现一个实时动态校验，将输入格式错误的显示为红色背景

    功能描述: 源码: 功能描述: 实时动态校验,如果输入的格式错误,将弹窗提示输入格式错误并将背景展示为红色. 源码: 前台: <hy:formfield name="cxfdl&quo ...

  6. WLAN参数释义及优化建议

    1.AP覆盖范围或天线角度 1)参数释义 AP覆盖范围或天线角度直接影响到了终端连接到WLAN的信号强度. 2)优化建议 在设备的工程安装过程中,合理选择AP的位置,合理调整AP的覆盖方向或外置天线的 ...

  7. linux开发各种I/O操作简析，以及select、poll、epoll机制的对比

    作者:良知犹存 转载授权以及围观:欢迎添加微信公众号:羽林君 IO 概念区分 四个相关概念: 同步(Synchronous) 异步( Asynchronous) 阻塞( Blocking ) 非阻塞( ...

  8. C语言简介与第一个C语言程序

    一.C语言产生的背景 C语言的出现与操作系统Unix是分不开的.Unix是1969年由美国贝尔实验室的K. Thompson和D. M. Ritchie两人用汇编语言编写,它存在许多不足,因此,需要一 ...

  9. Codeforces Round #682 (Div. 2)【ABCD】

    比赛链接:https://codeforces.com/contest/1438 A. Specific Tastes of Andre 题意 构造一个任意连续子数组元素之和为子数组长度倍数的数组. ...

  10. 最短路径问题---Floyed（弗洛伊德算法），dijkstra算法，SPFA算法

    在NOIP比赛中,如果出图论题最短路径应该是个常考点. 求解最短路径常用的算法有:Floyed算法(O(n^3)的暴力算法,在比赛中大概能过三十分) dijkstra算法 (堆优化之后是O(MlogE ...