求大神解释下面这JS的代码
如题，最好为每一段代码注上注释<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3...
如题，最好为每一段代码注上注释
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
</style>
</head>
<body>
<p>30行JS你能干什么</p>
<script>
var ctx = document.body.appendChild(document.createElement("canvas")).getContext('2d');
var i, j, k, a = [], w = ctx.canvas.width = 550, h = ctx.canvas.height = 240, r = Math.random, p = Math.PI;
setInterval(function(){
ctx.fillStyle = "rgba(0, 0, 0, .5)";
ctx.fillRect(0, 0, w, h);
i = 10;
while(i--){a.push({x:w/2,y:h/6,r:r()*3,c:"#fff",t:0,vx:r()*10-5,vy:r()*-5})}
for(i = a.length-1;i >= 0;i--){
k = a[i];
ctx.fillStyle=k.c;
ctx.beginPath();
ctx.arc(k.x, k.y, k.r, 0, p*2)
ctx.fill();
k.x+=k.vx;
k.y+=k.vy;
k.vy+=.2;
k.r -= .01;
if(k.y>h){k.y=h;k.vy*=-.5;k.r+=.005;}
k.r < 0 && a.splice(i, 1);
}
}, 17);
</script>
</body>
</html> 展开
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
</style>
</head>
<body>
<p>30行JS你能干什么</p>
<script>
var ctx = document.body.appendChild(document.createElement("canvas")).getContext('2d');
var i, j, k, a = [], w = ctx.canvas.width = 550, h = ctx.canvas.height = 240, r = Math.random, p = Math.PI;
setInterval(function(){
ctx.fillStyle = "rgba(0, 0, 0, .5)";
ctx.fillRect(0, 0, w, h);
i = 10;
while(i--){a.push({x:w/2,y:h/6,r:r()*3,c:"#fff",t:0,vx:r()*10-5,vy:r()*-5})}
for(i = a.length-1;i >= 0;i--){
k = a[i];
ctx.fillStyle=k.c;
ctx.beginPath();
ctx.arc(k.x, k.y, k.r, 0, p*2)
ctx.fill();
k.x+=k.vx;
k.y+=k.vy;
k.vy+=.2;
k.r -= .01;
if(k.y>h){k.y=h;k.vy*=-.5;k.r+=.005;}
k.r < 0 && a.splice(i, 1);
}
}, 17);
</script>
</body>
</html> 展开
展开全部
PageCommon 这是自定义的类
GetDataInfo 这是自己定义的方法
dr7[WMHR_BaseInfoData.NameStr_FIELD].ToString()
dr7这是一个表的集合,里面是查询到的数据
这就是一个拼接字符串哈
GetDataInfo 这是自己定义的方法
dr7[WMHR_BaseInfoData.NameStr_FIELD].ToString()
dr7这是一个表的集合,里面是查询到的数据
这就是一个拼接字符串哈
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
Canvas 对象表示一个 HTML 画布元素，这是html5的控件
/*
*document.createElement("canvas")创建一个canvas控件
* 将创建的canvas控件添加到页面上document.body.appendChild()
* getContext('2d')方法返回一个用于在画布上绘图的环境，目前只有唯一的参数2d,未来
* 可能会有3d,2D就是2维啊，3d就是3维嘛.
*/
var ctx = document.body.appendChild(document.createElement("canvas")).getContext('2d');
//画布宽度
w = ctx.canvas.width = 550
//画布高度
h = ctx.canvas.height = 240
//返回0和1之间的伪随机数，可能为0，但总是小于1
r = Math.random
//圆周率
p = Math.PI;
//setInterval函数，表示重复执行某个行为,17表示重复示行的毫秒数。
//设置画布填充的颜色
ctx.fillStyle = "rgba(0, 0, 0, .5)";
//绘制矩形
ctx.fillRect(0, 0, w, h);
//循环给数组A添加对象元素,x轴，y轴，c颜色,t高度
i = 10;
while(i--){a.push({x:w/2,y:h/6,r:r()*3,c:"#fff",t:0,vx:r()*10-5,vy:r()*-5})}
//循环绘制路线
for(i = a.length-1;i >= 0;i--){
//生成路线
ctx.beginPath();
//创建曲线
ctx.arc(k.x, k.y, k.r, 0, p*2)
//填充当前绘图（路径）
ctx.fill();
//后面的代码就是动态改变轨迹，然后重复执行以上步骤，打达烟花效果
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
貌似是让<p>运动的代码
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
2l好像说的对,应该是个html5的画刷
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
