Black_Kite
- 浏览: 6684 次
- 性别:
- 来自: 北京
-
最新评论
-
Black_Kite：
各位，麻烦看完了提个意见，或者说说自己的想法，谢谢啦
一个评 ...
canvas+js写的绘图小程序
文章列表
前段时间学习canvas写的一个小程序，实现了简单的绘图操作，第一次写比较具体的代码，希望大家支持，多提意见，谢谢。
1.文件介绍
Line.js 定义线的绘制方法
Circle.js 定义圆的绘制方法
Rectangle.js 定义长方形的绘制方法
drawBoard.html 主程序逻辑
2.主程序逻辑介绍
2-1. 鼠标按钮按下时，获得当前的状态，如果是线，创建一个Line对象
2-2. 鼠标按下并移动时，获得当前鼠标位置，开始绘图
2-2. 鼠标抬起时，绘制当前最新的图形
详细内容请看附件
4.事件类型
DOM2规定了5种事件
UI事件：在用户与页面上的元素交互时触发
鼠标事件：当用户通过鼠标在页面上执行操作时触发
键盘事件：当用户通过键盘在页面上执行操作时触发
HTML事件：当浏览器窗口发生变化或特定的C/S交互时触发
变动：当底层DOM结构发生时触发
鼠标事件
触发顺序： mousedown->mouseup->click->mousedown->mouseup->click->dblclick
mouseout：移除一个元素时触发
mouseover：首次一入到一个元素 ...
1.事件流:描述的是从页面接收事件的顺序。
IE是事件冒泡流：事件开始时由最具体的元素接收，然后逐级向上传播到不具体的节点。
Safari，Chrome，Firefox，Opera会将事件一直冒泡到window对象。
Netscape是事件捕获流 ：在事件到达预定目标之前捕获它。
Safari，Chrome，Firefox，Opera支持这种事件流模型，从window对象开始捕获事件。
DOM2级事件：首先发生事件捕获，为截获事件提供了机会。然后是实际的目标接收到事件。最后是事件冒泡阶段。
Safari，Chrome，Firefox，Opera会在捕获阶段触发事件对象，结 ...
分组
var re = /(dog){2}/g;
反向引用
按从左到右的顺序对分组进行编号
1.从RegExp中获得反向引用的值
var s = "#123456789";
var re = /#(\d+)/;
re.test(s);
alert(RegExp.$1); //输出123456789
2.还可以直接在定义分组的表达式中包含反向引用，通过\1,\2```实现
var s = "catcat";
var re = /(dog)\1/;
alert(re.test(s)); //tr ...
正则表达式
1.var re = new RegExp("cat","g");
2.var re = /cat/gi;
注：i——忽略大小写；g——全局匹配；m——匹配多行
RegExp的方法
1.test()——找到匹配返回true，否则返回false
var s = "aacat";
var re = /cat/;
alert(re.test(s)); //返回true
2.exec()——在字符串中搜索，并把匹配结果用一个数组返回
var s = "a bat, a c ...