| 编程（Programming）是编定程序的中文简称，就是让计算机代码解决某个问题，对某个计算体系规定一定的运算方式，使计算体系按照该计算方式运行，并最终得到相应结果的过程。为了使计算机能够理解（understand）人的意图，人类就必须将需解决的问题的思路、方法和手段通过计算机能够理解的形式告诉计算机，使得计算机能够根据人的指令一步一步去工作，完成某种特定的任务。这种人和计算体系之间交流的过程就是编程。 【实例名称】 JS实现循环滚动显示图片 【实例描述】 随着Blog的日渐鼎盛，个人信息的网络存储越来越受人们青睐。目前最流行的个人相册，是个人风采的又一展示方式。在相册中通常可以通过滚动的形式浏览照片。本例介绍如何在网站中实现图片的滚动。 【实例代码】 <html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>无标题页-本站（www.xue51.com）</title>
<script language="javascript">
//定义要显示的图片数组
imgArr=new Array()
imgArr[0]="<a href=http://www.google.com/
onmouseMove='javascript:outHover=true'
onMouseover='javascript:outHover=true'
onMouseout='javascript:outHover=false;mvStart()'>
<img src=LOGO1.gif border=0></a>"
imgArr[1]="<a href=http://www.baidu.com/
onmouseMove='javascript:outHover=true'
onMouseover='javascript:outHover=true'
onMouseout='javascript:outHover=false;mvStart()'>
<img src=LOGO2.gif border=0></a>"
imgArr[2]="<a href=http://www.google.com/
onmouseMove='javascript:outHover=true'
onMouseover='javascript:outHover=true'
onMouseout='javascript:outHover=false;mvStart()'>
<img src=LOGO1.gif border=0></a>"
imgArr[3]="<a href=http://www.baidu.com/
onmouseMove='javascript:outHover=true'
onMouseover='javascript:outHover=true'
onMouseout='javascript:outHover=false;mvStart()'>
<img src=LOGO2.gif border=0></a>"
imgArr[4]="<a href=http://www.google.com/
onmouseMove='javascript:outHover=true'
onMouseover='javascript:outHover=true'
onMouseout='javascript:outHover=false;mvStart()'>
<img src=LOGO1.gif border=0></a>"
//内部变量
var moveStep=4; //步长，单位：pixel
var moveRelax=100; //移动时间间隔，单位：ms
ns4=(document.layers)?true:false;
var displayImgAmount=4 ; //视区窗口可显示个数
var divWidth=220; //每块图片占位宽
var divHeight=145; //每块图片占位高
var startDnum=0;
var nextDnum=startDnum+displayImgAmount;
var timeID;
var outHover=false;
var startDivClipLeft;
var nextDivClipRight;
//初始化层
function initDivPlace()
{
if (ns4)
{
for (i=0;i<displayImgAmount;i++){
eval("document.divOuter.document.divAds"+i+".left="+divWidth*i)
}
for (i=displayImgAmount;i<imgArr.length;i++){
eval("document.divOuter.document.divAds"+i+
".left="+divWidth*displayImgAmount)
}
}else{
for (i=0;i<displayImgAmount;i++){
eval("document.all.divAds"+i+
".style.left="+divWidth*i)
}
for (i=displayImgAmount;i<imgArr.length;i++){
eval("document.all.divAds"+i+
".style.left="+divWidth*displayImgAmount)
}
}
}
//设置定时器移动图片
function mvStart(){
timeID=setTimeout(moveLeftDiv,moveRelax)
}
//清除定时器，停止移动
function mvStop(){
clearTimeout(timeID)
} function moveLeftDiv(){
if (ns4){
for (i=0;i<=displayImgAmount;i++){
eval("document.divOuter.document.
divAds"+parseInt((startDnum+i)%imgArr.length)+".left=
document.divOuter.document.divAds"+
parseInt((startDnum+i)%imgArr.length)+".left-moveStep")
} startDivClipLeft=parseInt(eval("document.
divOuter.document.divAds"+startDnum+".clip.left"))
nextDivClipRight=parseInt(eval("document.divOuter.
document.divAds"+nextDnum+".clip.right")) if (startDivClipLeft+moveStep>divWidth){
eval("document.divOuter.document.divAds"+
nextDnum+".clip.right="+divWidth)
eval("document.divOuter.document.divAds"+
startDnum+".left="+divWidth*displayImgAmount)
eval("document.divOuter.document.divAds"+
parseInt((nextDnum+1)%imgArr.length)+".left=
document.divOuter.document.divAds"+nextDnum+".left+"+divWidth)
eval("document.divOuter.document.divAds"+
parseInt((nextDnum+1)%imgArr.length)+".clip.left=0")
startDnum=(++startDnum)%imgArr.length
nextDnum=(startDnum+displayImgAmount)%imgArr.length
startDivClipLeft=moveStep-(divWidth-startDivClipLeft)
nextDivClipRight=moveStep-(divWidth-nextDivClipRight)
}else{
eval("document.divOuter.document.divAds"+nextDnum+".clip.left=0")
startDivClipLeft+=moveStep
nextDivClipRight+=moveStep
}
eval("document.divOuter.document.divAds"+
startDnum+".clip.left="+startDivClipLeft)
eval("document.divOuter.document.divAds"+
nextDnum+".clip.right="+nextDivClipRight)
}else{
for (i=0;i<=displayImgAmount;i++){
eval("document.all.divAds"+
parseInt((startDnum+i)%imgArr.length)+".style.left=
document.all.divAds"+parseInt((startDnum+i)%imgArr.length)+
".style.pixelLeft-moveStep")
}
startDivClipLeft=parseInt(eval("document.all.divAds"+
startDnum+".currentStyle.clipLeft"))
nextDivClipRight=parseInt(eval("document.all.divAds"+
nextDnum+".currentStyle.clipRight"))
if (startDivClipLeft+moveStep>divWidth){
eval("document.all.divAds"+nextDnum+".style.clip=
'rect(0,"+divWidth+","+divHeight+",0"+")'")
eval("document.all.divAds"+startDnum+
".style.left="+divWidth*displayImgAmount)
eval("document.all.divAds"+
parseInt((nextDnum+1)%imgArr.length)+".style.left=
document.all.divAds"+nextDnum+".style.pixelLeft+"+divWidth)
startDnum=(++startDnum)%imgArr.length
nextDnum=(startDnum+displayImgAmount)%imgArr.length
startDivClipLeft=moveStep-(divWidth-startDivClipLeft)
nextDivClipRight=moveStep-(divWidth-nextDivClipRight)
}else{
startDivClipLeft+=moveStep
nextDivClipRight+=moveStep
}
eval("document.all.divAds"+startDnum+".style.clip=
'rect(0,"+divWidth+","+divHeight+","+startDivClipLeft+")'")
eval("document.all.divAds"+nextDnum+".style.clip=
'rect(0,"+nextDivClipRight+","+divHeight+",0)'")
}
if (outHover){
mvStop()
}else{
mvStart()
}
}
//定义显示图片的层
function writeDivs(){
if (ns4){
document.write("<ilayer name=divOuter width=750 height="+divHeight+">")
for (i=0;i<imgArr.length;i++){
document.write("<layer name=divAds"+i+">")
document.write(imgArr[i]+" ")
document.write("</layer>")
}
document.write("</ilayer>")
document.close()
for (i=displayImgAmount;i<imgArr.length;i++){
eval("document.divOuter.document.divAds"+i+".clip.right=0")
}
}else{
document.write("<div id=divOuter
style='position:relative' width=750 height="+divHeight+">")
for (i=0;i<imgArr.length;i++){
document.write("<div id=divAds"+i+
" style='position:absolute;clip:rect(0,"+divWidth+","+divHeight+",0)'>")
document.write(imgArr[i]+" ")
document.write("</div>")
}
document.write("</div>")
for (i=displayImgAmount;i<imgArr.length;i++){
eval("document.all.divAds"+i+
".style.clip='rect(0,0,"+divHeight+",0)'")
}
}
}
writeDivs();
initDivPlace(); 需要在body中添加启动事件，代码如下所示：
</script>
</head>
<body onload="mvStart()">
<p>
调试其他进程的能力赋予您极广泛的权力，这是无法通过其他途经获得的，
在进行远程调试时更是如此。恶意的调试器可能对正在调试的计算机造成大范围的损害。
因此，对可能进行调试的人要有所限制。有关更多信息，请参见<a
>远程调试权限</a>。</p>
<p>
但是，许多开发人员没有意识到安全威胁也可以从相反的方向产生。
调试对象进程中的恶意代码可能危害调试计算机的安全：有许多必须防范的不道德的安全利用。</p>
<h1 >
安全性最佳做法</h1>
</body>
</html>
【运行效果】  【难点剖析】 本例的重点是ilayer层和Array数组。其中数组是JavaScript的重要对象，用来存储一系列类型相同的数据。ilayer层具有三维的感觉，使设计者能够对相互重叠的层组成的三维层进行精确地控制，这些相互重叠的层是Web页上透明或不透明的内容。 【源码下载】 为了JS代码的准确性，请点击：JS实现循环滚动显示图片 进行本实例源码下载
使用编程语言写的程序，由于每条指令都对应计算机一个特定的基本动作，所以程序占用内存少、执行效率高。
| 
