我每天都在这个挪威新闻网站“www.vg.no”上阅读新闻。有一天，我在安装了adblock的学校计算机上阅读了它，我注意到广告已被删除，但所有广告包装都说“关闭adblock等”。当我在学校学习信息技术时，我决定将其作为一个侧面项目来制作镀铬扩展，完全删除那些广告包装。
我做了一个扩展，并使用了一个在页面加载后调用脚本的content_script。我叫它script.js
因此，当页面加载时，我的脚本会运行。我的脚本看起来像这样：
var element = document.querySelector('div.ad-wrapper');
element.parentElement.removeChild(element);
这很好用，但后来我遇到了一个新问题。包装广告包装器的div会在每次加载页面时更改名称。我在网站上找到了一个脚本，它会在每次加载页面时随机化div类名称。
看起来像这样：
<script>
window.__AB__ = function() {
var dummy = Math.random().toString(36).replace(/[^a-z]+/g, '').substr(0, 5),
css = dummy + '.' + dummy + '{' + 'display: block;' + 'position: absolute;' + 'top: 0;' + 'left: -180px;' + 'width: 180px;' + 'height: 700px;' + 'background: #19C url(//1.vgc.no/img/vgab.png) no-repeat bottom;' + 'color: #FFF;' + 'line-height: 1.4em;' + '}' + dummy + '.' + dummy + ' .t1 {' + 'padding: 260px 10px 67px;' + 'font-size: 18px;' + '}' + dummy + '.' + dummy + ' .t2 {' + 'padding: 0 451px 0 11px;' + 'margin: 0;' + 'font-size: 18px;' + '}' + dummy + '.' + dummy + ' h1 {' + 'margin: 0 0 16px;' + 'padding: 18px 11px 0;' + 'font-size: 26px;' + 'font-weight: normal;' + '}' + dummy + '.' + dummy + ' .zwei {' + 'padding: 11px 40px;' + 'position: absolute;' + 'right: 11px;' + 'top: 81px;' + 'background-color: #FFF;' + 'border: 1px solid #227196;' + 'color: #D00;' + 'font-size: 18px;' + 'text-transform: uppercase;' + '}' + dummy + '.' + dummy + ' button {' + 'padding: 11px 0;' + 'margin: 0 10px;' + 'background-color: #FFF;' + 'border: 1px solid #227196;' + 'color: #D00;' + 'font-size: 18px;' + 'text-align: center;' + 'font-weight: normal;' + 'width: auto;' + 'text-transform: uppercase;' + 'height: auto;' + 'line-height: 1.2em;' + '}' + '.tablet .reg-grid-main .ad[class*=smartboard], .desktop .reg-grid-main .ad[class*=smartboard], .tablet .reg-grid-main .ad[class*=netboard], .desktop .reg-grid-main .ad[class*=netboard] { min-height: auto; }',
text = '<p class="t1"> Ved å skru på annonser, hjelper du å finansiere tidkrevende og viktig journalistikk. </p>',
topText = ' <h1>Hei, kjære VG-leser!</h1><p class="t2">Vi har oppdaget at du blokkerer annonser. Vi i VG hadde satt stor pris på om du hvitlister oss slik at vi kan finansiere vår journalistikk med reklame og fortsette å være en gratis nyhetskilde.</p>',
browser;
if (navigator.userAgent.indexOf('Firefox') > -1 ? true : false) {
browser = 'firefox';
} else {
browser = 'chrome';
}
var style = document.createElement('style');
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
var left = document.createElement(dummy);
left.className = dummy;
left.innerHTML = '<!--googleoff: index-->' + text + '<!--googleon: index-->';
var right = left.cloneNode(true);
right.style.right = '-180px';
right.style.left = 'auto';
var topEl = right.cloneNode();
topEl.style.position = 'relative';
topEl.style.right = 'auto';
topEl.style.width = '100%';
topEl.style.height = '150px';
topEl.style.marginTop = '-1px';
topEl.style.backgroundImage = 'none';
topEl.innerHTML = '<!--googleoff: index-->' + topText + '<!--googleon: index-->';
var open = function(e) {
var pop = document.createElement('div'),
dim = 1000,
over = document.createElement('div'),
btn = document.createElement('a');
function close(e) {
e.preventDefault();
btn.removeEventListener('click', close);
pop.parentNode.removeChild(pop);
over.parentNode.removeChild(over);
return false;
}
btn.addEventListener('click', close);
pop.style.cssText = 'width:' + dim + 'px; height: auto; position: absolute; top: 50%; left: 50%; background-color: #fff; padding: 10px; margin-left: -' + (dim / 2) + 'px; margin-top:-390px;z-index: 2000;';
over.style.cssText = 'width: 100%; height: 100%; position: fixed; top: 0; left: 0; bottom: 0; right: 0; background-color: #000; z-index: 1999; opacity: .8;';
over.addEventListener('click', close);
var popText = '<h3>Slik skrur du på annonser</h3>';
if (browser === 'chrome') {
popText += '<div style="float: left; margin-right: 16px; padding-right: 16px; border-right: 2px solid #19C;"><p><strong>For Adblock</strong></p>';
popText += '<img src="//1.vgc.no/ab/chrome-1.png"><br>';
popText += '<img src="//1.vgc.no/ab/chrome-2.png"></div>';
popText += '<p><strong>For Adblock Plus</strong></p>';
popText += '<img src="//1.vgc.no/ab/chrome-plus.png">';
} else if (browser === 'firefox') {
popText += '<div style="text-align: center;"><p><strong>For Adblock Plus</strong></p>';
popText += '<img src="//1.vgc.no/ab/firefox.png"></div>';
}
popText += '<div style="text-align: center; padding: 20px 0; clear: both;"><strong>Takk for at du skrur på annonser på VG.no :-)</strong></div>';
pop.innerHTML = popText;
btn.innerHTML = 'Lukk';
btn.className = 'close';
btn.href = '#';
document.body.appendChild(pop);
pop.appendChild(btn);
document.body.appendChild(over);
return false;
};
var topBoard = document.querySelector('#ad-topboard, #ad-front-topboard');
if (topBoard) {
topBoard.style.display = 'none';
}
var btn = document.createElement('button');
btn.addEventListener('click', open);
btn.className = 'action-click';
btn.setAttribute('data-stats-type', 'exit');
btn.setAttribute('data-stats-string', 'Adblock::OpenPopup');
btn.innerHTML = 'Skru på annonser';
left.appendChild(btn);
var btn2 = btn.cloneNode(true);
btn2.addEventListener('click', open);
right.appendChild(btn2);
var btn3 = btn.cloneNode(true);
btn3.addEventListener('click', open);
btn3.className = 'zwei';
topEl.appendChild(btn3);
document.head.appendChild(style);
var con = document.querySelector('.reg-grid-container');
con.appendChild(right);
con.appendChild(left);
if (con.insertAdjacentElement) {
con.insertAdjacentElement('afterbegin', topEl);
} else {
con.insertBefore(topEl, con.firstChild)
}
if (window.xt_med) {
window.xt_med('C', 0, 'Adblock::Enabled', 'N');
}
(window.dablockTrigger = window.dablockTrigger || []).push('survey');
window.__AB__ = function() {};
};
</script>
基本上他们正在创建一个名为dummy的变量，并为其提供一个随机生成的名称。所以我的问题，在这里，在stackoverflow，是，我怎么能得到div的类名，以便我可以删除它？我觉得有可能将整个脚本转换为字符串，然后搜索虚拟变量，然后删除该脚本或其他东西？此外，在包装广告的div中，我看到一个段落<p class="t1">，我试图删除父，这是随机生成的名称div但没有运气。有什么想法吗？
编辑：
一旦加载了根html，我尝试在manifest.json文件中调用脚本，因此在创建<head>之前调用脚本，但是在网站加载之前我做的任何更改很可能会被覆盖一次页面的其余部分加载正确吗？有没有办法制作一个不可编辑的功能？例如testfunction = function（）{}然后在另一个脚本中，当他们尝试运行testfunction = function（）{var element = random}时，他们不会覆盖已经声明的那个函数？
答案 0 :(得分：0)
已经快两年了，但是从那时起，我就自学了javascript +更多东西，并决定在这个项目中再做一次。从根本上讲，我只花了不到10分钟的时间就得出了一个解决方案，该解决方案非常简单。
我只是完全忽略了他们的“虚拟”脚本，并删除了容器div的3个第一个div子元素。这不是最好的解决方案，因为它有些硬编码。无论如何，尽管如此，它仍然具有魅力。所以现在我有了一个有效的扩展名：D
如果有人感兴趣，这是简单的.js代码：
window.addEventListener("load", function(){
var topAdWrapper = document.querySelector(".reg-grid-container");
for(var i = 0; i < 6; i++)
{
topAdWrapper.removeChild(topAdWrapper.childNodes[0]);
}
var body = document.querySelector("body");
body.style.backgroundImage = "";
});