JavaScript里面的延迟加载--setTimeout()的用法

最新推荐文章于 2024-08-16 10:08:38 发布
最新推荐文章于 2024-08-16 10:08:38 发布
阅读量1.1k 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/chengjingxuang123/article/details/95770752
版权

想实现类似线程sleep几秒钟的现象，虽然看到这个需求，我知道是要用这个setTimeout()方法来实现，J,avaS,cript延迟加载的功能，
但是不论自己以前的笔记还是说，自己在网上又搜索的例子。
都是乱的一塌糊涂，主要错误如：setTimeout(方法名(参数)，“数字”)，以为这样就可以了。
但是js也不报错，就是达不到自己想要的效果。
真是误人子弟啊。
主要是参数的使用不正确，如下：

1.参数一：
第一个参数是要执行的方法，只是方法名字不应该带括号和参数；
2.参数二：
第二个参数是要执行的时间，传入数字，不要带引号，带引号就是字符串啦。(哦，我又测试了下，带引号是可以的，好吧，这条略过。。。)

而且你要是打算在for循环里面使用，也不是不可以，写个回调方法就可以了。

而且这个方法是可以脱离j,Q,uery包，仅仅需要个浏览器就可以执行了，当然，浏览器是支持J,avaScript的。

我有如下代码，示范，是如何回调，循环打开五次网页的。

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
 
<body>
 
<div class="container">
<div class="jumbotron">
  <h1>心灵的鸡汤</h1>
  <p>生活不止于眼前的苟且，还有明天和后天的呢。</p>
</div>
</div>
 
<div class="container">
<div class="row">
  <div class="col-md-4">
    <h2>你</h2>
    <p>良辰美景奈何天，为谁辛苦为谁甜，这年华青涩逝去，明白了时间。</p>
  </div>
  <div class="col-md-4">
    <h2>我</h2>
    <p>浅望幸福，不写忧伤，红尘三千，不道惆怅，不问花开几许，只问浅笑安然。</p>
  </div>
  <div class="col-md-4">
    <h2>他</h2>
    <p>不管昨夜经历了怎样的泣不成声，早晨醒来这个城市依然车水马龙。</p>
  </div>
</div>
</div>
 
</body>
</html>


<script>
  var i = 0;
  openNew(0);
 
  /**
   * 打开新窗口
   */
  function openNew() {
    if (i < 5) {
      i++;
      window.open("https://www.baidu.com");
      setTimeout(openNew,5000);
    } else {
      return false;
    }
  }

 

setTimeout("要延时加载的方法",1000);

ItSocialXuan
关注
JS延迟加载(setTimeout) JS最后加载
12-11
第一 JS延迟加载 代码如下: [removed][removed] [removed] setTimeout(“document.getElementById(‘my’).src=’include/common.php’; “,3000);//延时3秒 [removed] 一般情况下都是利用setTimeout来实现 第二 JS最后加载 在需要插入JS的地方插入以下代码: 代码如下: <SPAN id=L4EVER>LOADING…</SPAN> 当然，那个LOADING…你可以换成自己喜欢的小图片
使用js的定时器setTimeout()实现加载进度条效果
Geek_ymv的专栏
10-23 8020
效果图如下：
（代码示例）使用setTimeout来延迟加载JS脚本文件
Keep trying, keep going
06-06 705
是一个JavaScript函数，用于在指定的延迟时间（以毫秒为单位）之后执行一个函数或代码片段。它可以用于实现延迟加载JS脚本文件。延迟加载JS脚本文件的目的通常是优化页面加载性能，让页面的关键内容优先加载，而非关键内容（如某些JS脚本）可以稍后加载。这样，浏览器可以先加载和渲染页面的关键内容，然后在指定的延迟时间之后加载和执行JS脚本文件。的函数，它接受一个URL作为参数，并创建一个。// 在2秒（2000毫秒）后加载脚本。，我们将在2秒（2000毫秒）后调用。函数，从而实现延迟加载JS脚本文件。
JS中【setTimeout】使用注意事项总结
最新发布
2301_79858914的博客
08-16 434
setTimeout是JavaScript中非常强大且常用的工具，但其异步特性、作用域问题以及潜在的性能影响需要开发者在使用时加以注意和正确处理。理解这些细节可以帮助你更有效地控制代码执行的时机，避免常见的错误和陷阱。
vue延时加载setTimeout与先后加载Promise.all
ffl886的博客
02-09 553
vue延时加载setTimeout与先后加载Promise.all
JavaScript脚本延迟加载的方式有哪些？（笔记）
qq_42533666的博客
02-16 1162
笔记，延迟加载就是等页面加载完成之后再加载 JavaScript 文件。 js 延迟加载有助于提高页面加载速度。
js实现延迟加载的几种方法
12-01
js的延迟加载有助与提高页面的加载速度，以下是延迟加载的几种方法： 1.使用setTimeout延迟方法的加载时间 延迟加载js代码，给网页加载留出更多时间 [removed] function A(){ $.post("/lord/login",{name:...
js实现延迟加载的方法
12-03
本文将详细探讨JavaScript中的两种主要延迟加载方法：`setTimeout` 和 `setInterval`。 ### setTimeout `setTimeout` 是JavaScript中的一个全局函数，用于在指定的毫秒数后调用一个函数或执行某段代码。基本语法...
javascript经典特效---双重导航菜单.rar
01-04
5. **延迟加载与性能优化**：为了提高页面加载速度，可以使用延时加载技术（如`setTimeout`或`requestAnimationFrame`），在用户真正需要时才加载子菜单，避免一次性加载过多内容导致的卡顿。 6. **响应式设计**：...
javascript--texiao-343.zip_javascript
09-19
5. **定时器与延迟执行**：`setInterval`和`setTimeout`函数用于定期或延迟执行代码，可用于创建倒计时、自动滚动、轮播图等功能。 6. **数组方法与遍历**：JavaScript的数组方法如`forEach`、`map`、`filter`等在...
JavaScript 延时加载 setTimeout("",);
weixin_41124484的博客
11-28 708
setTimeout("要延时加载的方法",1000); &lt;!-- 单位 : 毫秒--&gt;  
JS延迟加载 setTimeout方法释疑
Jahe's Blog
12-25 1818
setTimeout的标准语法是: setTimeout(表达式,时间(毫秒)) 两个参数. 在这里着重记下第一个参数是一个 function时的调用,假设是一个函数. 1.函数无参: function alertV(){ alert("000"); } 当第一个参数不加引号("" 或 '')时,延迟一秒: setTimeout(alertV,1000); 当第一个参数...
js 延期执行_JS延迟加载(setTimeout) JS最后加载
weixin_39837352的博客
02-01 421
为了让一个广告几秒以后再执行所以做个延迟加载的东东，用了JS实现，还蛮好用的，算是分享，也是记录吧。第一 JS延迟加载setTimeout("document.getElementById('my').src='include/common.php'; ",3000);//延时3秒一般情况下都是利用setTimeout来实现第二 JS最后加载在需要插入JS的地方插入以下代码:LOADING...当...
js设置函数setTimeout延迟加载
qq_41353397的博客
10-28 515
setTimeout(function(){ //里面写内容 },2000); 说明： 2000这个参数时间，你可以随便定义多长时间之后执行这个函数
js设置延时加载事件
热门推荐
AinUser的博客
06-06 1万+
[java] view plain copy 首先，这个主要就是前端js，进行控制的，所以，直接上代码喽   setTimeout( function(){ //事件处理 }， 1000)   1000毫秒=1秒   (单位是：毫秒)
js延迟加载的几种方式
mysunli的博客
02-20 1325
  面试的时候遇到的，所以整理出来，方便记忆。   js延迟加载有助于提高页面加载速度，一般有以下几种：defer属性、async属性、动态创建DOM方式、使用JQuery的getScript、使用setTimeout延迟方法、让js最后加载。 1.defer属性： HTML 4.01 为 &lt;script&gt;标签定义了 defer属性。 用途：表明脚本在执行时不会影响页面的构造。...
Js中的setInterval()和setTimeout()方法
tanxinji的博客
12-09 1061
定时器有两种 setInterval("函数名()"，时间间隔)，setTimeout("函数名()",时间间隔); 1.setTimeout("fun()"，time) 执行该函数后，隔time毫秒执行一次fun函数。只执行一次，放入到函数内可以实现多次调用。 要关掉该定时器就可以用到clearTimeout( timeobj); 在setInterval的时候用timeobj记录该对象，用于关闭该定时器。 例如：每隔一秒刷新当前时间，有...
setTimeout延迟加载javascript
weixin_34203832的博客
11-29 249
应用场景：当需要延迟加载该数据时，则可以使用setTimeout(). 意思：用于在指定的毫秒数后调用函数或计算表达式. 示例1： var t=setTimeout("alert('5 seconds!')",5000); 示例2：一个简单的计时操作： 　　 <head> <script type="text/javascript"> var c=0 ...
使用settimeout延迟加载js
09-09
settimeout是JavaScript中的一个方法，可以用来延迟执行一段代码。在使用setTimeout延迟加载JS时，可以通过设定延迟的时间来控制什么时候执行这段代码。 延迟加载JS有以下几个优点： 1. 提高网页加载性能：通过将一些不必要的JS代码延迟加载，可以减少网页的加载时间，提高用户的访问速度和体验。 2. 减少页面阻塞：JS代码的加载和执行会阻塞页面的渲染，如果直接将所有的JS代码都放在页面头部加载，会导致用户在页面加载过程中看到空白的页面。通过延迟加载JS，可以让页面在加载的同时渲染出页面内容，提高用户的体验。 3. 对于某些插件和第三方库，可以根据需要进行延迟加载，只在需要的时候加载相应的代码，减少页面的负载。 使用settimeout延迟加载JS的方法如下： 1. 在需要延迟加载的位置，使用setTimeout方法包装一段JS代码，设置延迟的时间。 2. 在延迟时间到达后，setTimeout会执行包装的代码。 例如，可以使用如下代码延迟加载一个JS文件： setTimeout(function(){ var script = document.createElement('script'); script.src = 'example.js'; document.head.appendChild(script); }, 2000); 上述代码会在页面加载后延迟2秒钟后加载example.js文件。 需要注意的是，在使用settimeout延迟加载JS时，延迟的时间应该根据实际情况进行调整，避免加载太早或者加载太晚导致的问题。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值