gpt4 book ai didi

javascript - 使用 javascript 或 jquery 将多个广告注入(inject)页面的有效方法是什么?

转载 作者:太空宇宙 更新时间:2023-11-04 15:29:49 25 4
gpt4 key购买 nike

用户可以选择开启广告。如果它找到(或没有)cookie,它应该显示广告。我已经能够将一些看起来可行的东西组合在一起并做我需要的事情,但它是丑陋和笨重的。从函数返回广告代码是我使其正确显示的唯一方法。我可以使用哪些快捷方式来只有一个主要功能来处理多个广告?

请放心,因为我是初学者。任何建议或方向都会很棒。谢谢。

    var showadsornot = getAdCode();

// Put strings in array
var adText = [
"<h1>Ad Code 1</h1>",
"<h1>Ad Code 2</h1>",
"<h1>Ad Code 3</h1>",
"<h1>Ad Code 4</h1>"
];

// Look in container to get an array of ad elements
var container = document.getElementById('globalWrapper');
var ads = container.querySelectorAll('.displayad');

// For each element insert the string with the same index
// (i.e. the first string matches the first element, etc.
Array.from(ads).forEach(function (displayad, index) {
displayad.innerHTML = writeAdCode(showadsornot, adText[index]);
});

function getAdCode() {
var showadsornot = "1"; // or empty null
return showadsornot;
}

function writeAdCode(showadsornot, adcode) {
var newAdCodeTwo = "";
if(showadsornot){
newAdCodeTwo += adcode;
} else {
newAdCodeTwo += "<h2>No Ads For You!</h2>";
}
return newAdCodeTwo;
}
<html>
<head></head>
<body>
<div id="globalWrapper">

<!-- Ad Code #1 -->
<div class="container">
<div class="displayad"></div>
</div>

<!-- Ad Code #2 -->
<div class="container">
<div class="displayad"></div>
</div>

<!-- Ad Code #3 -->
<div class="container">
<div class="displayad"></div>
</div>

<!-- Ad Code #4 -->
<div class="container">
<div class="displayad"></div>
</div>

</div>
</body>
</html>

最佳答案

由于您有 4 个相似的元素以及要插入到这些元素中的相同数量的字符串,因此使用数组会有所帮助。

假设您在这样的容器中构建广告元素:

<div id="ad-container">
<div class="ad"></div>
<div class="ad"></div>
<div class="ad"></div>
<div class="ad"></div>
</div>

这将允许您循环遍历元素数组并将匹配的文本放入其中。

// First put the strings in an array
var adText = [
"<ins class='adsbygoogle' style='display:inline-block;width:970px;height:250px' data-ad-client='xx-xxx-xxxxxxxxxxxx' data-ad-slot='00000000001'></ins>",
"<ins class='adsbygoogle' data-ad-format='auto' style='display:block' data-ad-client='xx-xxx-xxxxxxxxxxxx' data-ad-slot='00000000002'></ins>",
"<ins class='adsbygoogle' style='display:inline-block;width:970px;height:250px' data-ad-client='xx-xxx-xxxxxxxxxxxx' data-ad-slot='00000000003'></ins>",
"<ins class='adsbygoogle' style='display:inline-block;width:300px;height:1050px' data-ad-client='xx-xxx-xxxxxxxxxxxx' data-ad-slot='00000000004'></ins>"
];

// Look into the container to get an array of ad elements
var container = document.getElementById('ad-container');
var ads = container.querySelectorAll('.ad');

// For each of these ad elements insert the string with the same index
// (i.e. the first string matches the first element and so on
ads.forEach(function (ad, index) {
ad.innerHTML = writeAdCode(showadsornot, adText[index]);
});

您还可以做的其他事情是根据数组中广告字符串的数量动态地将“广告”元素添加到空容器中。您只需循环遍历字符串数组和 forEach 字符串即可创建广告元素并插入其文本。

关于javascript - 使用 javascript 或 jquery 将多个广告注入(inject)页面的有效方法是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44891547/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com