js

一、文档碎片

文档碎片的作用:可以提高DOM操作性能(理论上),实际上不一定提高性能,反而降低性能。

 

比如下面的两个页面进行比较:点击普通按钮和碎片按钮进行比较两个弹出的时间大小;时间越大说明性能越低;

 

文档碎片--普通页面:

<!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" />
< title>无标题文档</title>
< script>
window.onload=function(){
var oBtn=document.getElementById('btn1');

var oUl=document.getElementById('ul1');

oBtn.onclick=function(){
var iStart=new Date().getTime();
var i=0;

for(i=0; i<10000;i++){
var oLi=document.createElement('li');////建个新的节点li
oUl.appendChild(oLi);//把每一次oLi追加到oUl中

}
alert(new Date().getTime()-iStart);//所需要的用的时间

}
}
< /script>
< /head>
< body>
< input id="btn1" type="button" value="普通" />
< ul id="ul1">
< /ul>
< /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" />
< title>无标题文档</title>
< script>
window.onload=function(){
var oBtn=document.getElementById('btn1');

var oUl=document.getElementById('ul1');

oBtn.onclick=function(){
var iStart=new Date().getTime();
var oFrag=document.createDocumentFragment();//创建文档碎片
var i=0;

for(i=0; i<10000;i++){
var oLi=document.createElement('li');//建个新的节点li
oFrag.appendChild(oLi);
//把每一次内容附加到文档碎片
}
oUl.appendChild(oFrag);//一次性把文档碎片追加到oUl中
alert(new Date().getTime()-iStart);//所需要的用的时间

}

}
< /script>
< /head>


< body>
< input id="btn1" type="button" value="碎片" />
< ul id="ul1">


< /ul>
< /body>
< /html>

二、IO操作

C++

中一共在三个独立的头文件中定义,分别是

iostream 

定义读写控制窗口类型,

fstream

定义读写已命名文件类型,

sstream

所定义的是从内存中读取的

string

对形象。

其中

 

后面两个都是重

iostream

中派生而来的,如下图派生关系:

 

 

 

在这里需要注意一下的就是

 IO

对象不可复制或者是赋值,如下代码

 

ofstream out1

out2

 

out1 = out2

//

错误:不能对这个留的对象进行赋值

 

//

这里的打印对象时对流对象的一个赋值操作,也是错误的

 

ofstream print

ofstream 

 

out2 = print

out2

 

原因有两个:

 

1

只有支持复制的元素类型可以存储在

vector

或者是其他的容器中去。

由于流对象不能够

进行复制,因此不能存储在

vector

中,即不存在储存流的对象的

vector

或者是其他容器。

 

2

形参或者是返回类型也不能是留的类型。

如果要传递或返回

IO

对象则必须传回来的是指

针或者是引用。

 

ofstream &print

ofstream &

//

传递是引用并不是使参数进行了复制

 

while

print

out2

 

 

1

IO

标准库内部的条件状态:

 

strm::iostate  

由各个

iostream 

类定义,用于定义条件状态

 

strm::badbit  strm::iostate

类型的值,用于指出被破坏的流

 

strm::failbit  strm::iostate

类型的值,用于指出失败的流

 

strm::eofbit  strm::iostate

类型的值,用于指出流已经到达文件的结束符

 

2

IO

标准库条件状态获取、修改函数

 

s.eof()         

如果设置了流

s

eofbit

值,该函数返回

true 

s.bad()         

如果设置了流

s

badbit

值,该函数返回

true 

s.fail()         

如果设置了流

s

failbit

值,该函数返回

true

三、鼠标坐标x,y


var x , y;
 

 

//当需求为获得的坐标值相对于body时,用:

function positionBody(event){

    event = event||window.event;

    //获得相对于body定位的横标值;

    x=event.clientX

    //获得相对于body定位的纵标值;

    y=event.clientY

}

//当需求为获得的坐标值相对于某一对象时,用:

function positionObj(event,id){

    //获得对象相对于页面的横坐标值;id为对象的id

    var thisX = document.getElementById(id).offsetLeft;

    //获得对象相对于页面的横坐标值;

    var thisY = document.getElementById(id).offsetTop;

    //获得页面滚动的距离;

    //注:document.documentElement.scrollTop为支持非谷歌内核;document.body.scrollTop为谷歌内核

    var thisScrollTop = document.documentElement.scrollTop + document.body.scrollTop;

    event = event||window.event;

    //获得相对于对象定位的横标值 = 鼠标当前相对页面的横坐标值 - 对象横坐标值;

    x = event.clientX - thisX;

    //获得相对于对象定位的纵标值 = 鼠标当前相对页面的纵坐标值 - 对象纵坐标值 + 滚动条滚动的高度;

    y = event.clientY - thisY + thisScrollTop;

}

 

 

posted @ 2017-06-29 01:19  元小帝  阅读(167)  评论(0编辑  收藏  举报