JavaScript-202：5秒之后自动关闭广告

原创已于 2022-02-18 15:53:08 修改 · 705 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

臧小川

标签

#javascript #前端 #html

收录于

于 2022-02-18 15:51:58 首次发布

JavaScript基础专栏收录该内容

240 篇文章

订阅专栏

本文介绍了如何使用JavaScript实现一个5秒后自动隐藏广告的效果，通过querySelector选择元素并设置display属性为none。核心代码展示了动态控制DOM元素显示的简单实践。

在这里插入图片描述

效果图

在这里插入图片描述

结构

    <img src="https://www.dataojocloud.com/dataeye/v1/data/image/get?imageid=617a5596fd73380b818dc300" alt=""
        class="ad">

JS

        window.addEventListener('load', function ()
        {
            var ad = document.querySelector('.ad');
            setTimeout(function ()
            {
                ad.style.display = 'none';
            }, 5000)
        })

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

臧小川

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
打赏
打赏
打赏举报

举报

专栏目录

Proteus仿真翻车实录：虚拟终端连接COMPIM时最容易踩的3个坑及解决办法

最新发布

weixin_30839881的博客

03-29

775

本文深入解析Proteus仿真中虚拟终端与COMPIM连接的3个典型问题，包括虚拟终端窗口不弹出、波特率不匹配导致的乱码问题以及COM端口冲突。通过详细的解决方案和调试技巧，帮助用户快速解决这些常见陷阱，提升嵌入式系统仿真的效率和准确性。

参与评论您还未登录，请先登录后发表或查看评论

5秒之后关闭广告

m0_73605639的博客

02-22

178

5秒之后关闭广告

js----5秒后自动关闭广告

liuyi0604的博客

07-27

3897

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

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

mocoll的博客

08-21

3695

十七、5秒自动关闭广告思路： ①核心思路: 5秒之后,就把这个广告隐藏起来。 ②用定时器setTimeout 。 JS 代码：十八、倒计时思路： ①这个倒计时是不断变化的,因此需要定时器来自动变化( setInterval ) ②三个黑色盒子里面分别存放时分秒 ③三个黑色盒子利用innerHTML放入计算的小时分钟秒数 ④第一次执行也是间隔亳秒数，因此刚刷新页面会有空白 ⑤最好采取封装函数的方式,这样可以先调用一次这个函数 ,防止刚开始刷新页面有空白问题。 HTML 代码： JS 代码：（倒计时

定时关闭广告2020/11/24

weixin_50286102的博客

11-24

665

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网站定时弹出广告

mqingo的博客

11-06

625

需求分析: 一般网页，当我们刚打开的时候，它会5秒之后，显示一个广告，让我们看5秒钟，然后他的广告就自动消失了！技术分析: a.定时器 setInterval : 每隔多少毫秒执行一次函数 setTimeout: 多少毫秒之后执行一次函数 clearInterval clearTimeout b.显示广告 img.style.display = "...

Hanime1观影体验优化：Android平台广告拦截与播放增强完全指南

gitblog_01039的博客

01-27

2185

在移动观影场景中，Android平台用户常面临广告骚扰与播放体验不佳的双重困扰。Hanime1Plugin作为专为Hanime1.me网站设计的优化工具，通过智能广告拦截技术与专业级播放增强功能，彻底革新移动端观影体验。本文将从问题诊断入手，提供系统化的配置方案与场景化应用指南，帮助用户在5分钟内完成从安装到优化的全流程配置。 ## 一、Android观影核心痛点诊断 ### 1.1 广告干扰

Hanime1Plugin技术评测：Android平台观影体验优化方案深度分析

gitblog_00752的博客

02-11

1581

Hanime1Plugin作为一款针对Hanime1.me网站的Android浏览器插件，通过先进的广告拦截技术和播放器增强功能，显著提升了移动设备的观影体验。本评测将从技术实现、功能表现、性能测试和使用指南等维度，全面剖析这款工具的技术特性与实际应用价值，为用户提供客观专业的参考依据。 ## 技术架构与实现原理 ### 插件工作机制 Hanime1Plugin采用分层架构设计，主要由三个核心

Hanime1观影助手终极配置指南：打造纯净Android观影体验

gitblog_00201的博客

01-20

659

想要在Android设备上享受无广告、功能强大的Hanime1观影体验吗？Hanime1Plugin作为专为Hanime1.me网站设计的浏览器插件，通过智能技术手段为用户提供全方位的观影优化解决方案。本指南将带你从零开始，快速掌握这款插件的完整配置流程。 ## 🎯 观影困扰识别与解决方案在日常观影过程中，用户经常面临以下典型问题： **常见观影痛点分析**： - 视频播放过程中频繁弹出

html5转换成mp4,ffmpeg将mov文件转换为mp4的HTML5视频标签IE9

weixin_39673972的博客

05-30

870

对于ffmpeg：ffmpeg -i {input}.mov -vcodec h264 -acodec aac -strict -2 {output}.mp4您还可以添加ffmpeg/-q:a参数以指定视频的质量。您也可以使用HandBrake，它是比ffmpeg更简单的编码器。对于ffmpeg：handbrakecli -i {input}.mov -e x264 -E facc -o {ou...

html 页面定时广告,web前端：使用JQuery完成页面定时弹出广告

weixin_35346761的博客

06-03

405

jQuery是一个快速、简洁的Javascript框架，是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是"writeLess，DoMore"，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化html文档操作、事件处理、动画设计和Ajax交互。使用JQu...

html广告倒计时代码,javascript实现倒计时关闭广告

weixin_26782843的博客

06-09

673

用Javascript实现倒计时关闭广告案例正在学习大前端中，有代码和思路不规范不正确的地方往多多包涵，感谢指教在很多app与网页中，我们可以看到这样的广告：进入某个网站后，会弹出一个广告，然后广告会有倒计时，倒计时结束，这个广告便会消失，下面我们用代码来实现这一功能代码如下：Title.djs{width: 30px;height: 30px;position: absolute;left: 7...

网页自动关闭的代码

于大大大洋

12-05

3232

window.opener=null; window.open('', '_self', '');//模拟自己打开自己window.close();//再关闭就没有对话框了--------------------------以下是过多少秒自动关闭网页,弹窗JS定时关闭当前网页窗口_网页代码站setTimeout('window.close();', 5000); 5秒后关闭------------

网页打开5秒后弹出广告窗口

哆来咪er的博客

05-11

8352

广告是网站不可避免的话题，没有广告的话，大多数网站是无法生存的。但是，若用户每次一打开网站就弹出广告窗口，这样会影响网站的友好性。现介绍一种广告被延迟加载的方式–setTimeout()。<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>网页被打开5秒以后弹出广告窗口</title> <

WebAPI第三天学习总结—— 定时器

weixin_52819925的博客

08-17

528

定时器（两种） window 对象给我们提供了 2 个非常好用的方法-定时器。 setTimeout() setInterval() setTimeout() 炸弹定时器开启定时器语法： window.setTimeout(调用函数, [延迟的毫秒数]); setTimeout()这个调用函数我们也称为回调函数 callback 注意： window 可以省略。这个调用函数可以直接写函数，或者写函数名或者采取字符串’函数名()'三种形式。第三种不推荐延迟的毫秒数省略默认是 0，如果写

小程序--弹出框（界面交互）

huang_jimei的博客

05-28

2646

一、弹出几秒后自动消失 1、wx.showToast（） wx.showToast({ title: '成功', icon: 'success', duration: 2000 }) （1）icon :图标的值有以下几种：（2）duration:提示的延迟时间，默认时间值为1500 (3) title：提示的内容二、弹出提示框、需要用户点击确认手动关闭弹窗（还可以在用户点击确认的时候跳转到其它页面） wx.showModal({ title: '删除地址成功'

实现上线通知悬浮窗，5秒后自动关闭。

Lemon_Geek的博客

05-14

3984

实现思路： 1、通过开启一个service，在servcie中通过windowManager添加view实现在任意activity都能展示全局悬浮窗。 2、通过倒计时countDownTimer实现5秒关闭功能。 3、通过broadcast通知启动是否。 package com.vrv.emm.service; import android.app.Service; impo...

uniapp 微信小程序实现显示倒计时订单关闭

树上骑个猴的博客

05-23

1303

效果图： console.log('订单信息',res.data); this.printConfigInfo = res.data // 如果订单还存在有超时时间，应该在界面上进行显示 if(this.printConfigInfo.timeoutCancel>0){ this.orderCancelTime = this.printConfigInfo.timeoutCancel this.showCancelTimeHandle(

【BOM】五秒后自动关闭的广告

weixin_44995829的博客

06-14

234

五秒后自动关闭的广告

js案例:5秒后自动关闭

m0_63400611的博客

12-23

2317

分析核心思路:5秒之后把广告隐藏起来定时器setTimeout() 代码 <html> <head> <meta charset="utf-8"> <title>5秒后自动关闭</title> <style> img { } </style> </head> <body> <img src="./image/微信截图_20201201231713.png"