在前端网页开发时，焦点图的存在随处可见。通常都是去下载已经封装好的jquery来实现需要的功能，有多少人能实际了解实际原理吗？通过自己对原生js的学习，今天对setTimeout()·和clearTimeout()的用法做个小小的总结：
1.setTimeout()方法用于在指定的毫秒数后调用函数或计算表达式。
语法：setTimeout(code,millisec)其中code是要调用的函数后要执行的method或function，millisec指的是需等待的毫秒数
首先是自己写的一个事例，当鼠标点击开始计时，文本框就开始计数，点击停止按钮则结束计时。
<form name="fm2">
<input type="text" name="one" value="" size=10 />
<input type="button" value="开始计时" onclick="myName()"/>
</form>
js部分：
<script>
x=0
function myName(){
x=x+1
document.fm2.one.value=x;
setTimeout("myName()",1000);
}
</script>
浏览网页时当你点击开始计时，文本框就会执行js
效果图：
2.clearTimeout()
如果我们要使用这个方法，就要在设定setTimeout()时，给它一个名称，这个名称叫TimeoutID,当你想停止计时操作时就用这个。这个可以自定义的。
语法：clearTimeout(TimeoutID)
那么接下来我们结合上面的例子补充几句：
<form name="fm2">
<input type="text" name="one" value="" size=10 />
<input type="button" value="开始计时" onclick="myName()"/>
<input type="button" value="停止计时" onclick="clearTimeout(master)"/>
<!-- 这里的master指的是TimeoutID -->
</form>
js部分：
<script>
x=0
function myName(){
x=x+1
document.fm2.one.value=x;
master=setTimeout("myName()",1000);//我给setTimeout起名为master不用timeoutID表示
}
</script>
如图所示我添加了一个停止计时按钮，与之对应添加了一个点击事件，clearTimeout(master)起到了停止计时的功能。
效果图：
3.小结：前端菜鸟的挨踢学习之路，希望以上的学习笔记对前端苗苗们有所帮助，在使用大神们封装好的jquery库同时，可以自己学习原生js，这样才能帮助我们更好的理解代码，使用代码，也能提升自己的思维水平，fighting~~~