js开发实例 —— 5秒自动关闭广告&倒计时

最新推荐文章于 2024-04-18 19:55:51 发布
最新推荐文章于 2024-04-18 19:55:51 发布
阅读量3.3k 收藏 6
点赞数 2
分类专栏： 学习笔记 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mocoll/article/details/119831494
版权

十七、5秒自动关闭广告

思路：

①核心思路: 5秒之后,就把这个广告隐藏起来。

②用定时器setTimeout 。

JS 代码：

在这里插入图片描述

十八、倒计时

思路：

①这个倒计时是不断变化的,因此需要定时器来自动变化( setInterval )

②三个黑色盒子里面分别存放时分秒

③三个黑色盒子利用innerHTML放入计算的小时分钟秒数

④第一次执行也是间隔亳秒数，因此刚刷新页面会有空白

⑤最好采取封装函数的方式,这样可以先调用一次这个函数 ,防止刚开始刷新页面有空白问题。

HTML 代码：

在这里插入图片描述

JS 代码：

（倒计时代码）
在这里插入图片描述
在这里插入图片描述

墨_风
关注
  • 2
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
定时关闭广告2020/11/24
weixin_50286102的博客
11-24 464
setTimeout(function() { ad.style.display = ‘none’ }, 2000) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv=
javascript特效实现——当前时间和倒计时效果的简单实例
10-21
在JavaScript中，实现当前时间和倒计时效果主要依赖于`Date`对象和`setTimeout`函数。本文将通过一个简单的实例来讲解如何实现这两个功能。 首先，我们了解`Date`对象。`Date`是JavaScript内置的对象，用于处理日期...
JavaScript实现广告倒计时和跳过广告
wangyining070205的博客
09-08 790
最近打开手机上的app，映入眼帘的都是一个几秒的广告，带有倒计时，当然如果不喜欢的话可以点击跳过，跳过广告其实质应该就是关闭广告。以前用JavaScript做过一个定时关闭的广告，于是把代码完善了一下，加上倒计时效果和实现跳过部分的代码。
【实测】selenium脚本解决随机弹窗广告问题_python 谷歌网页跳随机广告
最新发布
2401_84301389的博客
04-18 905
下方这份完整的软件测试视频学习教程已经整理上传完成，朋友们如果需要可以自行免费领取。
js案例:5秒后自动关闭
m0_63400611的博客
12-23 2041
分析 核心思路:5秒之后把广告隐藏起来 定时器setTimeout() 代码 <html> <head> <meta charset="utf-8"> <title>5秒后自动关闭</title> <style> img { } </style> </head> <body> <img src="./image/微信截图_20201201231713.png"
巧用JavaScript定时器3秒自动关闭广告
zy1992As的博客
03-01 1275
在实际开发中，考虑到一个网页中可能会有很多个定时器，所以建议用一个变量保存定时器的id（唯一标识）,若想要在定时器启动后，取消该定时器操作，可以将setTimeost()的返回值（定时器id）传递给clearTimeout)方法。在上述代码中，当参数为一个函数名时，这个函数名不需要加()小括号，否则就变成了立即执行这个函数，将函数执行后的返回值传入。在上述语法中，第1个参数表示到达第2个参数设置的等待时间后要执行的代码，也可以传入一个函数，或者函数名，第2个参数的时间单位以毫秒（ms）计。
javascript 5秒后关闭广告案例
weixin_30839881的博客
04-14 343
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style> 7 body { 8 ...
用Javascript实现倒计时关闭广告案例
茂茂的博客
02-07 718
用Javascript实现倒计时关闭广告案例 正在学习大前端中，有代码和思路不规范不正确的地方往多多包涵，感谢指教 在很多app与网页中，我们可以看到这样的广告：进入某个网站后，会弹出一个广告，然后广告会有倒计时，倒计时结束，这个广告便会消失，下面我们用代码来实现这一功能 代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title
倒计时功能插件js
07-03
本文将深入探讨“倒计时功能插件js”的相关知识点，帮助开发者理解如何利用JavaScript实现倒计时功能。 首先，倒计时功能是网页或应用中常见的一种交互元素，通常用于事件预告、促销活动等场景。在JavaScript中，...
jquery 倒计时插件 jCountr 实例
05-12
内容索引:脚本资源,jQuery,倒计时,jQuery插件　jquery 倒计时插件和实例，jCountr——运用了jQuery.Countdown.js，结合 jquery.js而完成的倒计时效果，用法请看代码，不是太复杂。
JavaScript两种计时器的实例讲解
10-17
本篇文章主要介绍了JavaScript中的两种计时器——`setInterval()` 和 `setTimeout()`，并提供了实例讲解。 首先，`window.setInterval()` 是用来周期性执行某段代码的函数。它的基本语法是 `setInterval(code,...
95、精确到毫秒jQuery倒计时代码
04-17
在IT行业中，尤其是在Web开发领域，倒计时功能是一个常见的需求，它经常被用于活动预热、考试倒计时、限时优惠等场景。本话题聚焦于一个特定的实现方式——使用jQuery来创建精确到毫秒的倒计时代码。jQuery是一个...
js倒计时3s自动关闭窗口, 封装弹窗开关函数，好用
GO_Print的博客
10-19 1275
var timer = 0; // 倒计时函数 _jisuan (elementId, valueElem, count=3) { // 选择弹框id 填值元素 计时时间 var sum = count; timer = setInterval(function () { count--; document....
html弹窗自动关闭,js广告自动关闭弹窗
weixin_42404710的博客
05-31 338
dddddddddadTime=5;chanceAd=1;varns=(document.layers);varie=(document.all);varw3=(document.getElementById&&!ie);adCount=0;functioninitAd(){if(!ns&&!ie&&!w3)retu...
使用javascript倒计时关闭窗口
codejavamao的专栏
12-17 311
把下面的代码拷贝到head标签下： <script type="text/javascript"> var i = 4; clock(); function closewindow(){ window.returnValue = true; window.close(); } function clock(){ i = i -1; if(document.getEleme...
JS网页实例：若干秒后不操作自动关闭窗口
请叫我二狗哥
11-17 1320
对一些安全要求比较高的网页，如网银和支付平台界面，为了保证用户数据安全，往往会提供这样的功能：若用户在累计的一段时间内没有进行任何操作，就会自动退出登陆或直接关闭窗口。补充下面代码，要求若用户每5秒内没有点击页面，窗口自动关闭。
JS实现页面倒计时自动关闭
qq_16186465的博客
04-21 2754
JS实现页面倒计时自动关闭 没啥好说的直接上代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>支付成功</title> <style> * { margin: 0; padding: 0; } .timeOut
本节作业之5秒后自动关闭广告、倒计时、发送短信、5秒之后自动跳转页面、获取URL参数数据
小王的博客
04-12 910
本节作业之5秒后自动关闭广告、倒计时、发送短信、5秒之后自动跳转页面、获取URL参数数据
JavaScript-202：5秒之后自动关闭广告
臧小川的博客
02-18 576
5秒之后自动关闭广告
用JS使广告窗口倒计时5秒后关闭
06-07
可以使用JavaScript中的定时器函数 `setTimeout()` 来实现这个功能。可以编写以下代码： ```js // 获取广告窗口元素 var adWindow = document.getElementById("ad-window"); // 设置倒计时函数 function countdown() { // 获取倒计时元素 var countdownEl = document.getElementById("countdown"); // 获取剩余时间 var remainingTime = parseInt(countdownEl.innerText); if (remainingTime > 0) { // 更新剩余时间 countdownEl.innerText = remainingTime - 1; // 继续倒计时 setTimeout(countdown, 1000); } else { // 关闭广告窗口 adWindow.style.display = "none"; } } // 开始倒计时 setTimeout(countdown, 5000); ``` 上面的代码中，我们先获取了广告窗口的元素，然后定义了一个倒计时函数 `countdown()`，用来更新倒计时元素的显示，并继续倒计时。当倒计时结束后，我们就可以将广告窗口的样式设置为 `display: none`，从而关闭广告窗口。 最后，我们使用 `setTimeout()` 函数来设置一个5秒钟的定时器，当定时器触发时，就开始倒计时。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值