JavaScript在网页开发中应用广泛吗？

本文共计1085个文字，预计阅读时间需要5分钟。

目录+前言+基础+DOM+结构+基本变量+画圆+画线+让画面动起来+总结+前言+Canvas+真的是一个好东西，它给前端插上了想象的翅膀，随着+h5+的到来，将+web+带入了一个新的领域，基于+canvas+技术实现。

目录

• 前言
• 基础 Dom 结构
• 基本变量
• 画圆
• 画弧线
• 让画面动起来
• 总结

前言

canvas 真是一个好东西，它给前端插上了想象的翅膀，伴随着 h5 而来，将 web 代入了新的领域，基于canvas 技术实现的各种酷炫效果和2d、3d 游戏，也让浏览器能承载更加强大的功能。尤其是它性能还很好，搞游戏再合适不过了，我就喜欢用 canvas 写一些小游戏玩。

在线地址

最近无意中看到前段时间写的这个小效果，觉得挺有意思的，就分享出来；这是苹果ios 12 发布会上库克 ppt 里展示的内容，一个带荧光效果的环形进度条；一个接外包项目的朋友，遇到客户指定要这个效果，实在搞不定了找到我，于是才有了下面的复刻实现。

基础 Dom 结构

第一步先把标签元素写上，后面将据此生成画布上下文对象，canvas 标签内的内容将在浏览器不支持的情况下显示，否则会自动忽略。