gpt4 book ai didi

javascript - 如何像 Google AdSense 一样创建 JavaScript 异步渲染 html

转载 作者:行者123 更新时间:2023-11-28 06:54:03 24 4
gpt4 key购买 nike

我在 Google 上搜索了很多,试图为我的用户创建外部 JavaScript。

我的项目是我希望允许我的用户使用 JavaScript 从我的网站获取内容。

我希望我的代码与 Google AdSense 风格完全相同

<script async src="//mysite.com/api/content.js"></script>
<!-- Links add -->
<ins class="adsbygoogle"
style="display:inline-block;width:180px;height:90px"
data-ad-client="ca-pub-xxx"
data-ad-slot="xxx"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

有人可以帮忙吗,我如何在我的 content.js (mysite.com/api/content.js) 上进行编码以将任何内容输出到“ins.adsbygoogle”类中。

如果我使用 document.write("say Something");它工作正常,但不适用于异步,并且它不在我想要渲染它的 ins.adsbygoogle 上。

最佳答案

您遇到的问题之一是您的异步脚本可能会在文档中的脚本标记之后加载。解决此问题的一种方法是在运行任何代码之前监听加载事件。 googleads 代码似乎使用的替代方案是在文件末尾的异步脚本中运行一些 javascript。

假设您有一个如下所示的 html 页面:

<html>
<head>
<script async src="testasync.js"></script>
</head>
<body>
<p>hello</p>
<myblock></myblock>
<p>done</p>
</body>
</html>

例如,在 testasync.js 文件中,此代码应出现在末尾,并在异步加载完成后触发所有内容加载:

(function(){
addEvent(window, 'load', function(){ main_function() });

function addEvent(element, eventName, fn) {
if (element.addEventListener)
element.addEventListener(eventName, fn, false);
else if (element.attachEvent)
element.attachEvent('on' + eventName, fn);
}
})();

现在,当您的 javascript 加载时,将运行此函数,将事件监听器附加到页面,以便一旦页面准备好且 HTML 就位,您就可以运行实际功能。

在 testasync.js 的顶部,您的 main_function 将使用 javascript 执行类似以下操作:

main_function = function(){
document.getElementsByTagName('myblock')[0].innerHTML = '<p>present something here</p>';
};

此功能将出现在 testasync.js 文件的顶部。

如果您创建 testasync.js 文件和 html 文件,您应该会看到此工作。

如果您需要扩展任何内容,请随时编辑此回复。

关于javascript - 如何像 Google AdSense 一样创建 JavaScript 异步渲染 html,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32715916/

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