Question

如何将以下HTML / JS动态加载到DOM中：

    <div id="googleDFP" class="googleDFPAD">
        <script>googletag.cmd.push(function() {googletag.display('googleDFP');});</script>
    </div>

我没有问题将一些HTML附加到DOM但是我不确定如何将脚本附加到DIV中。

我想将其附加到名为：

的DIV

<div id="bannerDIV"></div>

以下不起作用：

$('#bannerDIV').append('<div id="googleDFP" class="googleDFPAD"><script>googletag.cmd.push(function() {googletag.display('googleDFP');});</script></div>');

注意：我需要脚本在加载后处于活动状态。

感谢任何想法：）

Answer 1

这是因为语法错误。您应该注意附加文本中的引用。请尝试以下方法：

$('#bannerDIV').append('<div id="googleDFP" class="googleDFPAD"> <script>googletag.cmd.push(function() {googletag.display(\'googleDFP\');});</script></div>');

Answer 2

您可以创建一个（vanilla javascript）函数来创建div和script元素，如：

function googleDFP(divTarget) {
    var div = document.createElement('div');
    div.setAttribute("id", "googleDFP");
    div.setAttribute("class", "googleDFPAD");
    var myScript = document.createElement('script');
    myScript.innerHTML = "googletag.cmd.push(function() {googletag.display('googleDFP');});";
    document.getElementById(divTarget).appendChild(div);
    document.getElementById("googleDFP").appendChild(myScript);
}

此函数接受目标 div ID作为参数。然后在想要将这些元素附加到传递目标元素ID的任何其他元素时调用 function ，如

googleDFP("bannerDIV");

Jquery - 动态加载html和脚本代码

2 个答案: