设置div的css样式
<style>
.box{
position:absolute;
}
<style/>
// 给document添加鼠标按下事件
document.onmousedown=function( ){
// 嵌套一个移动事件 mousemove
document.onmousemove=function(e){
// 1.在页面中创建一个div
var div=document.creatElement("div");
// 2.为这个div取一个类名
div.style.className="box";
// 3.设置div的宽高
var width=5;
var height=10;
div.style.width=width+"px";
div.style.width=height+"px";
// 4.添加定位,page 相对于页面的偏移值
div.style.left=e.pageX+"px"; // e的值需要与function的参数值保持一致
div.style.top=e.pageY+"px";
// 5.设置div的背景颜色
div.style.backgroundColor="black";
// 6.将div添加到body中
document.body.appendChild (div);
}
// 嵌套鼠标松开事件 鼠标松开绘图停止
document.onmouseup=function() {
document.onmousemove=null;
}
}