部分小节提供了非常详细的实战教程，让大家动手实践。 另外我还写了一个前端工程化 demo 放在 github 上。这个 demo 包含了 js、css、git 验证，其中 js、css 验证需要安装 VSCode，具体教程在下文中会有提及。 对于前端来说，技术选型挺简单的。就是…

window 的 onload 事件对于前端童鞋来说肯定是熟的不能再熟了，相信大家在刚入门时，见的最多的可能就是 load 事件了。load 事件接触多了，大家就会接触到它的闺蜜 DOMContentLoaded 事件，网上有很多介绍这两个事件的文章，对它们的解释无外乎以下两种…

1. 什么是同源策略？ 同源策略可防止 JavaScript 发起跨域请求。源被定义为协议、主机名和端口号的组合。此策略可防止页面上的恶意脚本通过该页面的文档对象模型，访问另一个网页上的敏感数据。 2. 跨域是什么？ 3. JSONP 是什么？ 这是我认为写得比较通俗易懂的一篇…

如果你用Chrome调试工具，还是停留在console阶段，赶紧来学习一波吧，绝对是满满的干货，让你效率UpUP。 本文侧重点就是关于Chrome DevTools。通过梳理Chrome DevTools 中的小技巧，这些技巧可以帮我们节省很多的时间，直接提升工作效率！ 上面是…

按照whatwg文档所展示的，截至到本文截稿之前，一共有 113 个HTML标签。 因为所出标签太多，所以我们很难都用得上或者意识到需要用。 但其实也有许多有趣但是我们未曾发掘的标签，本文所要介绍的 <dataList> 便是一个。 <dataList> 标…

在输入框里输入一个，就会触发一次“ajax请求”（此处是console）。 浪费请求资源，可以加入防抖和节流来优化一下。 本文会分别介绍什么是防抖和节流，它们的应用场景，和实现方式。防抖和节流都是为了解决短时间内大量触发某函数而导致的性能问题，比如触发频率过高导致的响应速度跟不…

消息提示框在实际应用场景当中比较常见，最常用的就是element ui的消息提示框，我们通常都是直接使用它们,但是我们有没有尝试过去探究其实现原理，并自己动手实现呢？为了提升我们的个人能力和竞争力，我们可以尝试来实现这样一个消息提示框。 这样一来，准备工作就完成了，接下来就是我…

在【异步发展史，这次一定会！】中，因为js引擎是单线程的，所以我们需要异步编程，需要将耗时的操作异步处理。但是当这些执行异步任务时，它们先被放入浏览器的事件任务队列中去，等到执行栈空闲时才会按照队列先进先出的原则被一一执行，但终究还是单线程。若是复杂耗时的任务仍然会耗费较大的时…

网上有很多关于抽奖转盘的代码和实例，有使用JavaScript控制动画的，有使用Canvas实现的，它们思路各不相同，本文将介绍一种采用CSS3的方式来实现转盘动画效果，非常简单，只需几行代码即可实现。 到此为止，一个简单的转盘抽奖程序就完成了，根据上面的思路，不仅可以旋转指针…