JavaScript的setTimeout()超时事件的计时开始时刻是在从上到下解析完＜body＞下面的JavaScript代码后开始的

最新推荐文章于 2025-05-20 16:07:43 发布
原创 最新推荐文章于 2025-05-20 16:07:43 发布 · 375 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了DOMContentLoaded事件在现代浏览器中的支持情况，它总是在load事件之前触发。对于不支持此事件的老版本浏览器，推荐使用0毫秒超时调用来模拟。超时调用确保在页面下载和构建完成后执行，但不能保证先于load事件。

《JavaScript高级程序设计》（第三版）

DOMContentLoaded 事件对象不会提供任何额外的信息（其 target 属性是 document）。
IE9+、Firefox、Chrome、Safari 3.1+和 Opera 9+都支持 DOMContentLoaded 事件，通常这个事件
既可以添加事件处理程序，也可以执行其他 DOM 操作。这个事件始终都会在 load 事件之前触发。
对于不支持 DOMContentLoaded 的浏览器，我们建议在页面加载期间设置一个时间为 0 毫秒的超
时调用，如下面的例子所示。
setTimeout(function(){
//在此添加事件处理程序
}, 0);
这段代码的实际意思就是：“在当前 JavaScript 处理完成后立即运行这个函数。”在页面下载和构建
期间，只有一个 JavaScript 处理过程，因此超时调用会在该过程结束时立即触发。至于这个时间与
DOMContentLoaded 被触发的时间能否同步，主要还是取决于用户使用的浏览器和页面中的其他代码。
为了确保这个方法有效，必须将其作为页面中的第一个超时调用；即便如此，也还是无法保证在所有环
境中该超时调用一定会早于 load 事件被触发。
 
总结：
超时调用不是从解析到setTimeout()函数体后就开始计时，而是在"页面下载和构建完成"，也即解析完<body>标签下面的JavaScript后才开始计时
js倒计时 与 超时
qq_43505774的博客
09-01 403
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l
javascript页面倒计时实例
10-23
在本文中，我们将深入探讨JavaScript页面倒计时的实现方法，并将重点放在如何在网页中创建一个简单的倒计时，并在倒计时结束时自动提交表单。页面倒计时是一种常见的网页功能，它通常用于限制用户执行某项任务的时间...
setTimeout(function(){ //在此添加事件处理程序 }, 0);
antelope_2014的博客
05-11 204
setTimeout(function(){　　//在此添加事件处理程序}, 0); 这段代码的实际意思就是：“在当前JavaScript 处理完成后立即运行这个函数。”在页面下载和构建期间，只有一个JavaScript 处理过程，因此超时调用会在该过程结束时立即触发。至于这个时间与DOMContentLoaded 被触发的时间能否同步，主要还是取决于用户使用的浏览器和页面中的其...
js定时器介绍：倒计时定时器setTimeout、间隔定时器setInterval
YY的博客
10-13 4797
js定时器介绍：倒计时定时器setTimeout、间隔定时器setInterval
setTimeout(function(){}) 堆栈 ES6 Promise
zhuswy的博客
04-14 1798
堆栈 setTimeout(function(){}) 闭包 ES6 Promise
js函数使用技巧之：setTimeout(function(){},0)
ytuwlg的专栏
12-03 449
setTimeout的作用是将函数推迟第二参数设定的毫秒数后再执行，如果是0，就意味着浏览器要马上执行该函数，但是浏览器解析到setTimeout，虽然会"立刻"执行，这个立刻的结果是： 浏览器会在文档内容处于稳定状态后立刻执行，这样就达到了和或者一样的效果。 更应该看到的是，此函数更优于上述方法，前面两个函数只能静态时刻处理（文档第一次载入的时候），而在系统开发中，常常由于查询、更新等操作后...
<head> <title>利用meta标签实现页面跳转</title> <meta http-equiv="refresh" content="1; url='http://zhijiujiu.cn'"> </head>
09-29
<p>您将在3秒后跳转到新页面。如果未跳转，请<a href="page2.html">点击这里</a>。</p> </body> </html> ``` #### 2. 跳转回首页 有时，我们可能需要将用户临时页面（如欢迎页）跳转到首页： ```html <!DOCTYPE ...
<HTML> <HEAD> <TITLE>智能倒计时器</TITLE> <HTA:APPLICATION ID="objHTA" SCROLL="no" SINGLEINSTANCE="yes" CONTEXT="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" WINDOWSTATE="normal"> <SCRIPT language="VBScript"> Sub SetTopMost() Dim objShell On Error Resume Next Set objShell = CreateObject("Shell.Application") If Err.Number <> 0 Then WScript.Echo "无法创建 Shell.Application 对象" WScript.Quit End If Dim window, count count = 0 For Each window In objShell.Windows ' 过滤非浏览器窗口（示例） If InStr(window.LocationURL, "http") > 0 Then count = count + 1 WScript.Echo "窗口标题: " & window.Name End If Next WScript.Echo "共找到 " & count & " 个浏览器窗口" Set objShell = Nothing If hwnd = 0 Then MsgBox "未找到HTA窗口", 16, "错误" Exit Sub End If End Sub ' 调用示例：点击按钮触发置顶 Sub btnSetTop_Click() SetTopMost End Sub Dim targetTime, isRunning Function ParseTime(input) If IsNumeric(input) Then ParseTime = DateAdd("s", CLng(input)*60, Now()) ' 使用CLng增强数值转换 Else MsgBox "请输入有效数字", 48, "错误" ParseTime = Null End If End Function Sub UpdateDisplay() Dim elapsed elapsed = DateDiff("s", Now(), targetTime) If isRunning then If elapsed < 0 Then display.innerHTML = FormatTime(Abs(elapsed)) & "（超时）" display.style.color = "red" Else display.innerHTML = FormatTime(elapsed) display.style.color = "green" End If End If If isRunning Then window.setTimeout "UpdateDisplay", 200 End Sub Function FormatTime(seconds) Dim h, m, s h = seconds \ 3600 m = (seconds Mod 3600) \ 60 s = seconds Mod 60 FormatTime = Right("0" & h,2) & ":" & Right("0" & m,2) & ":" & Right("0" & s,2) End Function Sub StartTimer() If Not isRunning Then targetTime = ParseTime(setTime.value) ' 移除Set关键字 If Not IsNull(targetTime) Then isRunning = True UpdateDisplay End If End If End Sub Sub StopTimer() isRunning = False display.innerHTML = "00:00:00" display.style.color = "black" End Sub </SCRIPT> </HEAD> <style> #display { font-size: 20px; margin: 5px; padding: 5px; border: 2px solid #ccc; } </style> <BODY> <button onclick="btnSetTop_Click">窗口置顶</button> <input type="text" id="setTime" size="4"> 分钟 <button onclick="StartTimer">启动</button> <button onclick="StopTimer">停止</button> <div id="display" style="font-family:Consolas"></div> </BODY> </HTML>窗口无法置顶，找不到窗口句柄
11-25
<think> 我们正在解决HTA（HTML Application）编写的智能倒计时器窗口无法置顶以及找不到窗口句柄的问题。在HTA中，窗口置顶通常需要使用Windows API函数，例如`SetWindowPos`。同时，获取窗口句柄（HWND）是置顶...
如果这100个页面超时是联动的呢，比如超时时间10s，在A页面操作后等待8s，又点击进入B页面操作，此时需要重新更新超时时间
最新发布
12-09
为了实现 100 个页面超时联动，并且在从 A 页面操作后等待 8s 进入 B 页面操作时重新更新超时时间，可以借助外部 JavaScript 文件来达成。以下是具体实现思路和代码示例： 首先，创建一个外部 JavaScript 文件，...
<HTML> <HEAD> <TITLE>智能倒计时器</TITLE> <HTA:APPLICATION ID="objHTA" SCROLL="no" SINGLEINSTANCE="yes" WINDOWSTATE="normal"> <SCRIPT language="VBScript"> Sub SetTopMost() On Error Resume Next Dim objShell Set objShell = CreateObject("WScript.Shell") hwnd = window.external.HWND ' 关键修正点 If hwnd = 0 Then MsgBox "无法获取窗口句柄", 16, "错误" Exit Sub End If Const SWP_NOMOVE = &H2, SWP_NOSIZE = &H1 objShell.Run "mshta vbscript:Execute(""CreateObject('Shell.Application').WindowSwitcher().SetWindowPos "" & " & hwnd & ", -1, 0, 0, 0, 0, " & (SWP_NOMOVE Or SWP_NOSIZE) & ")", 0, True End Sub ' 调用示例：点击按钮触发置顶 Sub btnSetTop_Click() SetTopMost End Sub Dim targetTime, isRunning Function ParseTime(input) If IsNumeric(input) Then ParseTime = DateAdd("s", CLng(input)*60, Now()) ' 使用CLng增强数值转换 Else MsgBox "请输入有效数字", 48, "错误" ParseTime = Null End If End Function Sub UpdateDisplay() Dim elapsed elapsed = DateDiff("s", Now(), targetTime) If isRunning then If elapsed < 0 Then display.innerHTML = FormatTime(Abs(elapsed)) & "（超时）" display.style.color = "red" Else display.innerHTML = FormatTime(elapsed) display.style.color = "green" End If End If If isRunning Then window.setTimeout "UpdateDisplay", 200 End Sub Function FormatTime(seconds) Dim h, m, s h = seconds \ 3600 m = (seconds Mod 3600) \ 60 s = seconds Mod 60 FormatTime = Right("0" & h,2) & ":" & Right("0" & m,2) & ":" & Right("0" & s,2) End Function Sub StartTimer() If Not isRunning Then targetTime = ParseTime(setTime.value) ' 移除Set关键字 If Not IsNull(targetTime) Then isRunning = True UpdateDisplay End If End If End Sub Sub StopTimer() isRunning = False display.innerHTML = "00:00:00" display.style.color = "black" End Sub </SCRIPT> </HEAD> <style> #display { font-size: 20px; margin: 5px; padding: 5px; border: 2px solid #ccc; } </style> <BODY> <button onclick="btnSetTop_Click">窗口置顶</button> <input type="text" id="setTime" size="4"> 分钟 <button onclick="StartTimer">启动</button> <button onclick="StopTimer">停止</button> <div id="display" style="font-family:Consolas"></div> </BODY> </HTML>无法找到置顶窗口句柄
05-11
<think>嗯，用户的问题是关于在HTA应用中使用VBScript获取窗口句柄以实现窗口置顶，但遇到了困难。首先，我需要回忆一下HTA和VBScript的相关知识。HTA（HTML Application）允许使用HTML和脚本语言如VBScript或...
setTimeout()的相关知识和应用
michael8512的博客
11-26 427
1、运行时机 setTimeout并不是等其他任务完成时才开始计时，而是在出发setTimeout时开始计时，如果setTimeout后面的程序的运行时间大于setTimeout的等待时间，则setTimeout中的函数会优先于后面的程序执行。 例如： setTimeout(function(){ console.log('a') },50) anotherFun();如果ano
JS【详解】setTimeout 延时（含清除 setTimeout，计时开始时间，0 秒延时解析，多 setTimeout 执行顺序，setTimeout 应用场景，网红面试题）
朝阳39的博客
05-29 1万+
setTimeout 是一个 js 内置的函数，用于延时执行代码。
JavaScript计时器详解：setTimeout与setInterval的使用与注意事项
小白的博客
05-20 2267
JavaScript中的计时器功能，主要包括setTimeout和setInterval，是开发中常用的工具。setTimeout用于在指定延迟后执行一次函数，而setInterval则按照固定周期重复执行函数。两者在使用时需注意清除计时器以避免内存泄漏，并关注this指向问题。此外，计时器的准确性受限于JavaScript的单线程特性，且最小延迟时间受浏览器限制。对于动画效果，推荐使用requestAnimationFrame以提高性能。在实际开发中，计时器可用于实现延迟执行、轮询数据、动画效果等功能，同
js 中的SetTimeOut()
u010450065的专栏
10-31 4118
setTimeout( ) 是属于 window 的 method, 但我们都是略去 window 这顶层物件名称, 这是用来设定一个时间, 时间到了, 就会执行一个指定的 method setTimeout setTimeout 语法例子 用 setTimeout 来执行 function 不断重复执行的 setTimeout 设定条件使 setTi
setTimeout理解
weixin_41989250的博客
02-17 6276
如果在设定的时间内，发生新的keydown事件，则不触发Ajax通信，并且重新开始计时。所以上面的代码执行流程是：JS执行到setTimeout时，将其交给浏览器去计时（哪怕时间是0），然后去执行同步的for循环，因为例子中的for循环执行需要5s左右，在for循环执行3秒时，浏览器已经把之前的计时器计时完毕，然后推送到JS的事件队列里，当做下一个task任务执行，当前任务(for循环)不受影响，当for循环结束后，JS线程空了，然后去事件队列中取微任务或者新的任务(setTimeout)，然后执行。
JavaScript中setTimeout()的用法详解
热门推荐
suwu150
01-16 12万+
要使用 clearTimeout( ), 我们设定 setTimeout( ) 时, 要给予这 setTimout( ) 一个名称, 这名称就是 timeoutID , 我们叫停时, 就是用这 timeoutID来叫停, 这是一个自定义名称,。这处的 flag 是一个变数, 可任意取名, 我们用 flag来称呼这变数的原因, 是因为这变数好处一支旗, 将旗竖起 (flag is on), 就会产生一个作用, 将旗放下 (flag is off), 就产生另一个作用。
js动画之requestAnimationFrame
weixin_33728708的博客
02-27 380
1.setTimeout和setInterval 在讲setTimeout和setInterval之前，先讲一下异步执行的运行机制。（同步执行也是如此，因为它可以被视为没有异步任务的异步执行。） （1）所有同步任务都在主线程上执行，形成一个执行栈（execution context stack）。 （2）主线程之外，还存在一个"任务队列"（task queue）。只要异步任务...
关于setTimeout计时器问题
依稀梦兮的博客
04-03 827
for (var i = 1;i <= 5;i ++) { setTimeout(function timer() { console.log(i) },1000) } 执行程序时，先把计时器的函数放在线程任务中，相当于setTimeout(线程1，1000)，在执行完主任务for语句后（时间远小于1000）再调用线程，而此时i是全局变量，值为5，所以结果是:5,5,5,5,5同...
详解setTimeout()
Moments
01-30 3万+
前言：看了这篇文章，1.注意setTimeout引用的是全部变量还是局部变量了，当直接调用外部函数方法时，实际上函数内部的变量已经变成全局。2.提醒我防止出错的，用匿名函数不容易出错。3.setTimeout最快执行时间是4毫秒。4.使用setTimeout的函数会比当前队列的函数慢执行，在他们的后面。5.setTimeout中的定时器并不是准确的时间，实际中它需要在执行完前面的函数后才定时执行。 你还可以查阅关于setTimeout的相关介绍 JavaScript提供定时执行代码的功能，叫做定时器（tim
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值