点击“不再展示此广告”后需用JS+localStorage在广告渲染前拦截：绑定事件委托、记录ID、MutationObserver监听、iframe改占位符或传参控制，否则仅display:none无效。
点击“不再展示此广告”后如何真正停掉广告？
浏览器里点完“不再展示此广告”，广告照常刷出来——这不是你网络有问题，是绝大多数网页压根没把这功能当真。HTML 本身不提供广告屏蔽能力，display: none 或 remove() 只作用于当前页面刷新前的 DOM，关掉标签页再进来，广告照旧。真正生效得靠 JS 配合存储策略，且必须在广告容器渲染前就干预。
- 纯 HTML + CSS 无法持久关闭广告：没有状态保存机制，
style="display:none"下次加载完全无效 - 用户点击事件必须绑定到可稳定获取的父容器或委托节点，不能依赖动态生成的按钮 ID（比如
ad-close-btn-123这类带随机数的） - 推荐用
localStorage记录已屏蔽的广告 ID 或类型，例如存ad_blocked_list数组，每次广告渲染前先查表 - 注意同源限制：跨 iframe 广告（如第三方广告联盟）无法被主站 JS 直接控制，
document.getElementById()会返回null
用 JavaScript 实现“本次会话内立即隐藏”最简路径
别碰复杂框架，几行原生 JS 就够。关键是监听点击、找到最近的广告容器、加 class 触发隐藏，并确保样式提前定义好。
- 给“不再展示”链接加上
data-ad-id属性，例如：<a href="#" data-ad-id="taboola-2024">不再展示此广告</a> - 绑定事件时用事件委托，避免反复绑定：
document.body.addEventListener('click', handleAdBlock) - 在
handleAdBlock里用event.target.closest('[data-ad-id]')找到触发元素，再向上找广告容器（比如.ad-unit或[data-ad]） - 执行
adContainer.classList.add('ad-hidden')，对应 CSS 写.ad-hidden { display: none !important; }——!important是防广告脚本内联样式覆盖
为什么 localStorage 方案经常失效？
存了又读不出来，不是代码写错，而是时机和范围没对上。常见断点就在广告加载节奏和存储键名设计上。
- 广告 JS 往往异步加载，你的屏蔽逻辑如果写在
<head>或DOMContentLoaded里，可能比广告容器还早执行，查不到 DOM - 存储键名别用模糊值，比如存
"blocked"，而要用具体标识："blocked_ad_id:taboola-2024"或"blocked_ad_type:video-banner" - 读取
localStorage后，得等广告容器出现再执行隐藏；可用MutationObserver监听新增节点，或轮询document.querySelectorAll('[data-ad-id]') - 注意 Safari 的无痕模式默认禁用
localStorage，此时需降级到sessionStorage或直接内存标记（仅当前页有效）
第三方广告 iframe 怎么办？
点“不再展示”后，iframe 里的广告根本收不到主站 JS 指令。这是同源策略铁律，绕不过，只能换思路。
立即学习“前端免费学习笔记（深入）”；
- 主站无法操作 iframe 内容，但可以控制 iframe 是否加载：把广告
<iframe src="...">改成占位<div class="ad-placeholder" data-ad-src="https://ads.example.com/..."></div> - JS 在加载前检查
localStorage，若命中屏蔽规则，就跳过iframe.src = ...赋值，只留空容器 - 部分广告平台（如 Google Ad Manager）支持传参控制，例如在 URL 加
&cust_params=hide_ad=true，后端或广告标签可据此不返回素材 - 终极底线：用
iframe.style.display = 'none'隐藏整个 iframe，但要注意留白高度问题，建议同步设置height: 0; overflow: hidden;
