js小知识

文档碎片是什么：

//文档碎片:类似一个临时的文档，要所有要加的dom元素先放在这里，达到不要每次操作dom元素
提高页面效率


    var d1 = new Date();    //创建十个段落,常规的方式    for(var i = 0 ; i < 1000; i ++) {        var p = document.createElement("p");        var oTxt = document.createTextNode("段落" + i);        p.appendChild (oTxt);        document.body.appendChild(p);    }    var d2 = new Date();    document.write("第一次创建需要的时间:"+(d2.getTime()-d1.getTime()));    //使用了createDocumentFragment()的程序    var d3 = new Date();    var pFragment = document.createDocumentFragment();    for(var i = 0 ; i < 1000; i ++) {        var p = document.createElement("p");        var oTxt = document.createTextNode("段落" + i);        p.appendChild(oTxt);        pFragment.appendChild(p);    }    document.body.appendChild(pFragment);    var d4 = new Date();    document.write("第2次创建需要的时间:"+(d4.getTime()-d3.getTime()));

IO操作：
一、功能实现核心：FileSystemObject对象其实，要在js中实现文件操作功能，主要就是靠FileSystemObject对象.
二、FileSystemObject编程三部曲
使用FileSystemObject进行编辑要经过如下步骤：创建FileSystemObject对象、应用相关方法、访问相关属性,
(一)创建FileSystemObject对象，创建FileSystemObject对象的代码只要1行：
var fso=new ActiveXObject("Scripting.FileSystemObject"); //实例化
上述代码执行后，fso就成了一个FileSystemObject对象实例。
(二)应用相关方法，如创建一个文本文件：
var fso=new ActiveXObject("Scripting.FileSystemObject"); //实例化
var f1=fso.createtextfile("e:\\b.txt",true); //创建记事本
(三)访问相关属性,要访问相关属性，首先要建立指向对象的句柄，这就要通过get系列方法实现：GetDrive负责获取驱动器信息，GetFile负责获取文件信息. 比如，指向下面的代码后，f2就成了指向文件e:\\a.txt的句柄,并获取属性.
var fso=new ActiveXObject("Scripting.FileSystemObject"); //实例化
var f1=fso.createtextfile("e:\\b.txt",true); //创建记事本
var f2=fso.GetFile("e:\\a.txt");
alert("File last modified:"+f2.DateLastModified); //显示最后修改时间
但有一点请注意，对于使用create方法建立的对象，就不必再使用get方法获取对象句柄了，这时直接使用create创建的句柄名称就可以
var fso=new ActiveXObject("Scripting.FileSystemObject"); //实例化
var f1=fso.createtextfile("e:\\b.txt",true); //创建记事本
alert("File last modified:"+f1.DateLastModified); //显示最后修改时间
三、操作驱动器(Drives)
使用FileSystemObject对象来编程操作驱动器(Drives)和文件夹(Folders)很容易
(一)Drives对象属性Drive对象负责收集系统中的物理或逻辑驱动器资源内容，它具有如下属性：
TotalSize:以字节(byte)为单位计算的驱动器大小。
FreeSpace:以字节(byte)为单位计算的驱动器可用空间。
DriveLetter:驱动器字母
Drive Type：驱动器类型, 取值为removable(移动介质)、fixed(固定介质)、netword(网络资源)、CD-ROM或者RAM盘
SerialNumber:驱动器的系列码
例子：
var fso=new ActiveXObject("Scripting.FileSystemObject"); //实例化
var drv=fso.GetDrive(fso.GetDriveName("c:\\")); //读驱动器
var s="";
s+="Driver C:"+"-";
s+=drv.VolumeName+"\n";
s+="Total Space:"+drv.TotalSize/1024;
s+="kb"+"\n";
s+=drv.FreeSpace/1024;
s+="Kb"+"\n";
alert(s);
四、操作文件夹
var fldr,s="";
var fso=new ActiveXObject("Scripting.FileSystemObject"); //实例化
fldr=fso.GetFolder("c:\\");//获取Diver对象
alert("parent folder name is"+fldr+"\n");//显示父目录名称
alert("Contained on drive"+fldr.Drive+"\n");//显示所在drive名称
if(fldr.IsRootFolder)//判断是否为根目录
alert("this is the root folder.");
else
alert("this folder isn't a root folder.");
fso.CreateFolder("c:\\bogus");//创
建新文件
alert("create folder C:\\bogus"+"\n");
alert("Basename="+fso.GetBaseName("c:\\bogus")+"\n");//显示文件夹基础名，不包含路径名
fso.DeleteFolder("c:\\bogus");
alert("Deletedd folder c:\\bogus"+"\n");//删除文件夹
五、操作文件
(一)创建文件
var fso=new ActiveXObject("Scripting.FileSystemObject"); //实例化
var f1=fso.createtextfile("e:\\b.txt",true); //创建记事本
var ForWriting=2;
var ts=fso.OpenTextFile("e:\\c.txt",ForWriting,true);//创建文本文件的另一种方法
(二)读写数据
var fso=new ActiveXObject("Scripting.FileSystemObject"); //实例化
var f1=fso.createtextfile("e:\\b.txt",true); //创建记事本
f1.WriteLine("Testing 1,2,3"); //填写一行值,带换行符
f1.WriteBlankLines(3);//填写3个空行
f1.Write("this is a test");//填写一行
f1.Close();//关闭流
var ForReading=1;
f1=fso.OpenTextFile("e:\\b.txt",ForReading);//打开文件
s=f1.ReadLine();//读一行到字符串s
alert(s);
六、移动，拷贝和删除文件
var fso=new ActiveXObject("Scripting.FileSystemObject"); //实例化
f1=fso.GetFile("f:\\b.txt");//读源目录
f1.Copy("d:\\b.txt");//拷贝到目录下
f1.Move("e:\\b.txt");//移动到的目录, 移动文件
f1.Delete();//删除文件
H5+是什么：HTML5+扩展了JavaScript对象plus，使得js可以调用各种浏览器无法实现或实现不佳的系统能力，设备能力如摄像头、陀螺仪、文件系统等，业务能力如上传下载、二维码、地图、支付、语音输入、消息推送等。

取鼠标坐标位置有这些：鼠标在视口的坐标位置(clientX,clientY),鼠标在页面的坐标位置(pageX,pageY),鼠标在屏幕的坐标位置(screenX,screenY)，其中鼠标在视口的坐标位置(clientX,clientY),以及鼠标在屏幕的坐标位置(screenX,screenY)在所有的浏览器中都支持，但是鼠标在页面的坐标位置(pageX,pageY)在IE8及更早版本不支持，但是没有关系，可以通过scrollLeft 和 scrollTop可以计算出pageX,pageY的值。
首先是跨浏览器的事件对象
var EventUtil = {    addHandler:function(elem,type,handler){        if(elem.addEventListener)        {            elem.addEventListener(type,handler,false);        }else if(elem.attachEvent)        {            elem.attachEvent("on"+type,handler);        }else        {            elem["on"+type]=handler;        }    },    removeHandler:function(elem,type,handler){        if(elem.removeEventListener)        {            elem.removeEventListener(type,handler,false);        }else if(elem.detachEvent)        {            elem.detachEvent("on"+type,handler);        }else        {            elem["on"+type]=null;        }    },    getEvent:function(event){        return event?event:window.event;    },    getTarget:function(event){        return event.target||event.srcElement;    },    preventDefault:function(event){        if(event,preventDefault){            event.preventDefault();        }else{            event.returnValue = false;        }    },    stopPropagation:function(event){        if(event.stopPropagation){            event.stopPropagation();        }else{            event.cancelBubble=true;        }    }    };
1.视口坐标位置
var div = document.getElementById("myDiv");EventUtil.addHandler(div,"click",function(event){      event = EventUtil.getEvent(event);      alert("Client coordinages: "+event.clientX+","+event.clientY);});
2.屏幕坐标位置
var div = document.getElementById("myDiv");EventUtil.addHandler(div,"click",function(event){      event = EventUtil.getEvent(event);      alert("Screen coordinates: "+event.screenX+","+event.screenY);});
3.页面坐标位置
var div = document.getElementById("myDiv");EventUtil(div,"click",function(event){     event = EventUtil.getEvent(event);     var pageX = event.pageX;     var pageY = event.pageY;     if(pageX==undefined)    {          pageX=event.clientX+document.body.scrollLeft||document.documentElement.scrollLeft;    }     if(pageY==undefined)     {         pageY = event.clientY+document.body.scrollTop||document.documentElement.scrollTop;     }     alert("Page coordinates: "+pageX+","+pageY);});