console.log(0)
setTimeout(() => {
console.log(1)
}, 0);
console.log(2)
如上代码会输出 0,2,1。 setTimeout 里面的是最后执行的。这是因为 JavaScript 的任务队列分为同步队列和异步队列, 优先执行同步队列里的任务,同步队列里的任务执行完了才会执行异步队列里的任务。setTimeout 里的代码会被放到异步队列里,这样就改变了代码的执行顺序。指定时间 0 是让 JavaScript 执行异步队列时尽早执行这部分代码。
JavaScript 中 setTimeout 0 的使用
对于JavaScript的定时器(setInterval、setTimeout)来说,使用它们来调用其他函数时,两种调用方法是有区别的。
第一种方法如下,以字符串形式调用函数。
!function () { function f() { console.log("saber"); } setTimeout("f()",1); }()
使用这种方式要注意一点,它不能调用局部函数,只能调用全局函数。如函数f是个局部函数,用这种方式调用会报错:
Uncaught ReferenceError: f is not defined
碰到需要调用的函数是局部函数的话,则可以使用第二种调用方式:
!function () { function f() { console.log("saber"); } setTimeout(f,1); }()
直接写函数名就行了。困扰我多年的问题现在终于明白了。
JavaScript定时器里调用非全局函数的办法
var bgarr = ["/f/xuejian.jpg","/f/aisaberbg3.jpg","/f/aisaberbg4.jpg"];
var bgindex=0;
function changeBg () {
if (bgindexjs定时切换背景图片
因为本站的logo经常换,换来换去也没几个满意的,所以写了个js,把现在有的图都放上,一个个切换。
<script type="text/javascript"> var headImg=["/f/head1.png","/f/head2.png","/f/head3.png"]; var headImgIndex=1; function cc () { headImgIndex=headImgIndex+1; if (headImgIndex==headImg.length) {headImgIndex=0}; //alert(headImgIndex); document.getElementById("logo").setAttribute("src", headImg[headImgIndex]); } $(document).ready(function () { setInterval("cc()", 10000); }); </script>
这样以后就可以随便折腾logo了←_←(雾
定时器最好在页面载入后使用,使用的function要先定义好。
用定时器定时更换logo
之前在fsn网站,发现它被a标签所包含的元素都有一个效果:当鼠标经过时透明度(opacity)逐渐降低至0.4,鼠标离开则逐渐恢复到1。效果如图:
上网百度了一下,没找到合适的,于是决定自己来写。以我js超小白的水平,写了俩小时才算弄完...真是欲哭无泪。先是定时器的语法和用法不清楚,百度之后明白了,结果又遇到各种语法错误、结构错误。这些都解决之后,又出现逻辑错误,例如opacity可以无限减小或者无限增加,真是头都大了,最后终于搞的差不多了。代码如下:
原理是:a标签的没有预先指定opacity,则相当于是1,完全不透明(html的默认解析)。鼠标经过a标签的时候判断,如果透明度大于0.5(期望渐变到最后的透明度),则启动定时器使透明度逐渐降低,达到0.5之后停止。鼠标离开之后判断,如果opacity小于1,则逐渐增加,达到1之后停止。
由于jq用的是百度云的cdn,所以联网状态下直接复制代码就ok了,否则可能需要自己引入可用的jq。另外ie6-ie8不支持opacity属性,所以无效是正常的,勿念