使用 Chrome 扩展移除或替换 Google Ads

使用 chrome 扩展移除或替换 google ads

本文旨在指导开发者通过 Chrome 扩展移除或替换网页中的 Google Ads。针对使用 Google Publisher Tag (GPT) 和 Adsense 的两种情况,分别提供了相应的 JavaScript 代码示例。同时,本文还提供了完整的 Chrome 扩展代码,包括 manifest.json、service-worker.js 和 pageScript.js,指导开发者如何在扩展中注入脚本,实现对广告内容的定制化修改。

移除或替换 Google Ads 的方法

本教程将介绍如何使用 Chrome 扩展程序来移除或替换网页中的 Google Ads。根据网站使用的广告服务类型,我们将提供两种不同的方法:一种适用于使用 Google Publisher Tag (GPT) 的网站,另一种适用于使用 Adsense 的网站。

针对 Google Publisher Tag (GPT) 的方法

如果目标网站使用 Google Publisher Tag (GPT) 来展示广告,可以使用以下 JavaScript 代码来替换广告内容:

for (i = 0; i < googletag.pubads().getSlots().length; i++) {    var slotDomId = googletag.pubads().getSlots()[i].getSlotElementId();    document.getElementById(slotDomId).innerHTML = '

yourcustomInnerHTML

';}

这段代码会遍历所有 GPT 定义的广告位,并将其内容替换为自定义的 HTML 内容。 googletag.pubads().getSlots() 获取所有广告位,getSlotElementId() 获取广告位对应的 DOM 元素的 ID,然后使用 innerHTML 属性修改其内容。

更多关于 getSlotElementId 的信息,请参考 Google Publisher Tag 文档。

注意事项:

此方法仅适用于使用 Google Publisher Tag (GPT) 的网站。确保在 googletag 对象可用后执行此代码。

针对 Adsense 的方法

如果目标网站使用 Adsense 来展示广告,可以使用以下 JavaScript 代码来替换广告内容:

var adsenseBlocks = document.querySelectorAll('ins.adsbygoogle');for (i = 0; i < adsenseBlocks.length; i++) {    var slotDomId = adsenseBlocks[i].parentNode.id    document.querySelector('#' + slotDomId).innerHTML = 'yourcustomInnerHTML';}

这段代码会查找所有 ins.adsbygoogle 元素(Adsense 广告的常见标记),然后获取其父元素的 ID,并将其内容替换为自定义的 HTML 内容。

注意事项:

此方法假设 Adsense 广告位嵌套在一个父元素中,并且该父元素具有唯一的 ID。此方法可能需要根据网站的 Adsense 集成方式进行调整。

Chrome 扩展程序实现

为了将上述代码应用到目标网站,需要创建一个 Chrome 扩展程序。以下是扩展程序的基本结构和代码:

manifest.json

{  "name": "Your Extension Name",  "action": {},  "manifest_version": 3,  "version": "0.1",  "description": "blablabla",  "permissions": [        "activeTab",        "webNavigation",        "scripting"    ],  "host_permissions": [    "https://*/"  ],  "background": {    "service_worker": "service-worker.js"  },  "web_accessible_resources": [{        "resources": ["pageScript.js"],        "matches": [""]  }]}

permissions:声明扩展程序需要的权限,包括 activeTab、webNavigation 和 scripting。host_permissions:指定扩展程序可以访问的网站,”https://*/” 表示允许访问所有 HTTPS 网站。background:指定后台脚本,用于监听浏览器事件。web_accessible_resources:允许网页访问扩展程序中的资源,例如 pageScript.js。

service-worker.js

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {function insertScript() {    var s = document.createElement('script');    s.src = chrome.runtime.getURL('pageScript.js');    s.onload = function() { this.remove(); };    (document.head || document.documentElement).appendChild(s);}  chrome.webNavigation.onCompleted.addListener((tab) => {    chrome.scripting.executeScript(      {        target: { tabId: tabId },        func : insertScript      });  });});

chrome.tabs.onUpdated.addListener:监听标签页更新事件。chrome.webNavigation.onCompleted.addListener:监听网页加载完成事件。chrome.scripting.executeScript:在指定标签页中执行脚本。insertScript() 函数创建一个 元素,将其 src 属性设置为 pageScript.js 的 URL,并将其插入到网页的 或 元素中。

pageScript.js

function customHTML() {   for (i = 0; i < googletag.pubads().getSlots().length; i++) {        var slotDomId = googletag.pubads().getSlots()[i].getSlotElementId();        document.getElementById(slotDomId).innerHTML = '

yourcustomInnerHTML

'; } } //add GPT eventlisteners to detect refresh & lazyloaded ads googletag.pubads().addEventListener("slotOnload", (event) => { const slot = event.slot; customHTML(); });

customHTML() 函数包含了用于替换 GPT 广告位的 JavaScript 代码。googletag.pubads().addEventListener(“slotOnload”, (event) => { … }); 添加了 GPT 事件监听器,用于检测广告刷新和延迟加载,并在广告加载后执行 customHTML() 函数。

使用 Adsense 的 pageScript.js 示例:

function customHTML() {    var adsenseBlocks = document.querySelectorAll('ins.adsbygoogle');    for (i = 0; i < adsenseBlocks.length; i++) {        var slotDomId = adsenseBlocks[i].parentNode.id        document.querySelector('#' + slotDomId).innerHTML = '

yourcustomInnerHTML

'; }}// Run the function after the DOM is loadeddocument.addEventListener('DOMContentLoaded', function() { customHTML();});

注意事项:

确保在 manifest.json 文件中正确配置了 permissions 和 host_permissions。pageScript.js 中的代码将在目标网站的上下文中执行,因此可以访问网站的 DOM 和 JavaScript 对象。为了确保代码在广告加载后执行,可以使用事件监听器或延迟执行。

总结

通过以上步骤,你可以创建一个 Chrome 扩展程序,用于移除或替换网页中的 Google Ads。根据网站使用的广告服务类型,选择相应的 JavaScript 代码,并将其集成到 pageScript.js 文件中。请务必仔细阅读代码中的注释,并根据实际情况进行调整。

以上就是使用 Chrome 扩展移除或替换 Google Ads的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1516644.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月20日 10:12:36
下一篇 2025年12月20日 10:12:43

相关推荐

  • Three.js Canvas透明背景实现教程

    本教程详细指导如何在Three.js中创建透明背景的Canvas。核心步骤包括在初始化渲染器时设置alpha: true参数,并使用renderer.setClearColor()将背景颜色清空为完全透明。通过具体代码示例,展示如何将粒子波浪动画集成到具有自定义背景的网页中,确保Canvas内容与底…

    2025年12月20日
    000
  • 在Three.js中创建透明背景Canvas的指南

    本教程详细阐述了如何在Three.js中实现Canvas的透明背景。核心步骤包括在初始化渲染器时通过alpha: true参数启用透明通道,并随后使用renderer.setClearColor()方法将清除颜色设置为完全透明。此外,为确保透明效果可见,需要为Canvas下方的HTML元素设置一个可…

    2025年12月20日
    000
  • 解决Safari浏览器SVG动画不显示的问题

    本文旨在解决SVG动画在Safari浏览器中无法正常显示的问题。通过分析问题代码,指出CSS嵌套特性在Safari浏览器中的兼容性问题,并提供解决方案:移除CSS嵌套,采用更兼容的CSS写法。同时,简要介绍了使用@supports规则进行CSS特性检测的方法,但建议直接采用兼容性更好的CSS写法以避…

    2025年12月20日
    000
  • React应用中XMLHttpRequest流式数据处理与实时渲染优化

    本文深入探讨了React客户端如何利用XMLHttpRequest的onprogress事件高效接收服务器端流式数据,解决了传统onreadystatechange无法分块处理的问题。通过结合setTimeout(0)技巧,优化了React状态更新机制,确保数据实时分块渲染,并涵盖了GET与POST…

    2025年12月20日
    000
  • React应用中处理数据流:XMLHttpRequest的优化与实践

    本文深入探讨了在React应用中使用XMLHttpRequest处理数据流时遇到的常见问题,特别是数据无法按块实时接收的挑战。核心解决方案在于将onreadystatechange事件替换为更适合跟踪数据接收进度的onprogress事件,并结合setTimeout(0)技巧优化React状态更新,…

    2025年12月20日
    000
  • 基于关联表和引用字段动态筛选引用字段值的教程

    本文档旨在提供一种解决方案,用于在ServiceNow平台中,基于已存在的关联关系,动态筛选引用字段的值。通过使用高级引用限定符和Script Include,可以实现在选择用户后,只显示尚未与该用户关联的商品,从而避免重复关联,提高数据录入的准确性。 在ServiceNow平台中,经常会遇到需要根…

    2025年12月20日
    000
  • 动态过滤引用字段:基于关联数据和另一引用字段的选择

    本文详细介绍了如何在ServiceNow中实现动态过滤引用字段的功能。通过配置高级引用限定符(Reference Qualifier)并结合服务器端脚本(Script Include),可以根据当前表单中已选择的另一个引用字段的值,智能地过滤出未被关联的记录,从而提升数据输入的准确性和用户体验。 1…

    2025年12月20日
    000
  • AG Grid固定列宽度限制与滚动功能实现教程

    本教程旨在解决AG Grid中固定列过多导致非固定数据不可见的问题。通过动态创建自定义容器包裹AG Grid的特定区域,并结合JavaScript实现固定列与非固定列的水平滚动同步,最终利用CSS样式强制控制布局与滚动行为,为AG Grid固定列提供最大宽度限制及内部滚动功能,尤其适用于启用分页的场…

    2025年12月20日
    000
  • 解决Vue组件直接访问或刷新页面时数据加载失败的问题

    本文旨在解决Vue应用中,当用户直接通过URL访问或刷新页面时,组件无法正确加载异步数据的问题。通过分析Vuex状态管理和组件生命周期中的数据获取逻辑,我们将详细阐述如何优化Vuex的Action、Mutation和Getter,并调整组件的created生命周期钩子,确保数据(特别是通过local…

    2025年12月20日
    000
  • 解决Vuex应用中页面刷新或直接访问导致UI数据加载失败的问题

    本教程旨在解决Vuex应用中常见的UI数据加载问题,即在直接通过URL访问或刷新页面时,组件无法正确显示数据。核心原因在于异步操作参数传递不当以及状态管理机制不完善。我们将通过优化Vuex Store的Actions、Mutations和Getters,并改进组件的生命周期钩子,确保数据在任何访问场…

    2025年12月20日
    000
  • 解决Vuex异步操作中直接URL访问或刷新页面数据加载失败问题

    本文深入探讨了Vue.js应用在使用Vuex进行异步数据加载时,通过直接URL访问或页面刷新导致数据无法正确渲染UI的问题。通过分析Vuex action参数传递缺失和状态管理不当的根源,提供了详细的Vuex store和组件代码优化方案,确保数据在任何导航场景下都能被正确检索和响应式更新。 问题描…

    2025年12月20日
    000
  • SVG动画在Safari中不显示?CSS嵌套兼容性问题与跨浏览器解决方案教程

    本教程旨在解决SVG动画在Safari浏览器中不显示的问题。核心原因在于CSS嵌套这一新特性尚未获得广泛浏览器支持。我们将详细阐述该兼容性挑战,并提供将嵌套CSS规则重构为传统选择器语法的解决方案,确保SVG动画在包括Safari在内的所有主流浏览器上稳定运行,提升跨浏览器兼容性。 理解CSS嵌套及…

    2025年12月20日
    000
  • iframe刷新后保持内部链接状态的教程

    当iframe在页面刷新后重置到初始链接时,本文将介绍两种核心策略来解决此问题:一是通过sessionStorage或localStorage手动存储并恢复iframe的当前URL;二是利用history.pushState()将iframe的URL序列化到父页面URL中,从而实现更持久和可共享的状…

    2025年12月20日
    000
  • AG Grid 固定列宽度限制与横向滚动实现教程

    本教程旨在解决AG Grid中固定(pinned)列过多导致非固定列被遮挡的问题。通过一种“非官方”的DOM操作、事件监听及CSS覆盖方案,实现固定列区域的宽度限制和横向滚动,确保用户始终能访问所有数据。该方案适用于特定场景,尤其与AG Grid分页功能结合使用效果更佳,但需注意其潜在的兼容性风险。…

    2025年12月20日
    000
  • iframe 内容刷新不重置:实现持久化导航状态的教程

    本教程详细讲解如何在网页刷新后保持 iframe 内部的导航状态不被重置。我们将探讨两种主要方法:通过 sessionStorage 或 localStorage 手动存储和恢复 iframe 的 URL,以及更推荐的利用父页面 URL 路由(history.pushState)来序列化 ifram…

    2025年12月20日
    000
  • 解决Iframe刷新后内容重置问题:持久化内部导航状态

    本文旨在解决Iframe在父页面刷新后其内部导航状态丢失,导致内容重置回初始src的问题。我们将探讨两种主要策略:一是利用浏览器存储(如sessionStorage或localStorage)手动保存并恢复Iframe的当前URL;二是结合父页面的路由机制,通过history.pushState()…

    2025年12月20日
    000
  • iFrame状态持久化:刷新后保持内部导航位置的实现策略

    当页面刷新时,iFrame内部的导航状态通常会重置回其初始src链接,导致用户体验不佳。本文将深入探讨如何解决iFrame在页面刷新后无法保持其内部链接的问题,提供两种主要的解决方案:基于客户端存储进行状态恢复,以及通过父页面URL同步iFrame状态。通过详细的实现步骤、代码示例和注意事项,帮助开…

    2025年12月20日
    000
  • AG Grid 固定列最大宽度与滚动优化教程

    本教程旨在解决AG Grid中固定列过多导致非固定列数据被遮挡的问题。由于AG Grid核心功能缺乏直接解决方案,本文将介绍一种通过DOM操作、自定义容器包裹、事件监听实现滚动同步以及CSS样式覆盖的非标准方法。该方案能为固定列设置最大宽度并使其可水平滚动,同时保持与非固定列的协调,但需注意其“ha…

    2025年12月20日
    000
  • 动态HTML表格行中输入字段的联动自动填充教程

    本教程详细阐述了如何在动态生成的HTML表格行中实现输入字段的联动自动填充。通过摒弃对固定ID的依赖,转而利用CSS类和事件上下文传递,我们能够确保JavaScript函数准确地操作当前行内的元素,从而实现高效、可扩展的数据填充逻辑,尤其适用于需要重复创建相同结构元素的场景。 动态HTML表格行中的…

    2025年12月20日
    000
  • PHP循环中JavaScript代码去重与高效事件处理指南

    本教程旨在解决PHP循环中嵌入大量重复JavaScript代码的问题,这些代码通常用于处理动态生成元素的交互。我们将介绍如何通过事件委托机制、统一使用CSS类而非动态ID,并结合event.target、closest和querySelector等现代DOM操作方法,实现JavaScript代码的去…

    2025年12月20日
    000

发表回复

登录后才能评论
关注微信