
本文旨在指导开发者通过 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
微信扫一扫
支付宝扫一扫