innerHTML不适用于Javascript输出内容

Question

我试着做一些广告旋转器如下：

<html>
<head>
    <title></title>
    <style>
        body {
            margin:0;
            padding:0;
        }
    </style>
    <script>
        function fillBoard() {
            s = document.getElementsByClassName('slots');
            board = document.getElementById('board');
            board.innerHTML = s[0].innerHTML
            alert(board.innerHTML);
        }
    </script>
</head>

<body>
    <div id="board" style="width:160px; text-align: center; margin:0">
    </div>

    <div class="slots" style="display:none">
        <!-- THE PROBLEM IS HERE -->
        <!-- Begin Hsoub Ads Ad Place code -->
        <script type="text/javascript">
            <!--
            hsoub_adplace = 1310003403401506;
            hsoub_adplace_size = '125x125';
             //-->
        </script>
        <script src="http://ads2.hsoub.com/show.js" type="text/javascript"></script>
        <!-- End Hsoub Ads Ad Place code -->
    </div>
    <div class="slots" style="display:none">
        <img src="http://lorempixel.com/160/90/sports/1/" />
    </div>

    <div class="slots" style="display:none">
        <img src="http://lorempixel.com/160/90/sports/2/" />
    </div>

    <div class="slots" style="display:none">
        <img src="http://lorempixel.com/160/90/sports/3/" />
    </div>

    <script>
        fillBoard();
    </script>
</body>

</html>

在上述守则中：

1. 有一个带有id board的div作为显示内容的板。
2. 面板中应该填充来自其他隐藏divs的数据，这些数据的类名为slots，使用innerHTML属性。
3. 为此，在页面的head部分中定义了一个名为fillBoard()的函数，然后在关闭</body>标记之前调用它的末尾。

发生了什么事？

隐藏的div slots可以很好地处理包含图像的div。但是，在第一个div中有一个javascript代码，它应该从一个ads网络生成不起作用的广告。

我希望ads网络的javascript代码应该用数据填充其div，然后调用的fillBoard()将其内容复制到board div。但是，这是不发生的！

我需要知道怎样才能克服这个问题？

一个活生生的例子是http://quran.2index.net/assets/alt_ads2.html

Answer 1

您只需显示所需的隐藏div，这通常比复制DOM内容更好。如果您确保一次只显示一个隐藏的div，则可以始终在相同的位置显示图像。

尝试如下所示的第一个"slots"元素：

s[0].style.display = 'block';

Answer 2

好的，经过进一步的挖掘，我发现了这个问题，尽管我目前还没有一个简单的解决方案。

js文件show.js正在为您生成iframe中的一些广告内容，您将其放在第一个“插槽”div中。很简单。当您将板的内容设置为第一个插槽类的内容时，将在板div中创建一个iframe，但是没有相同的内容。

经过一些搜索后，如果iframe的innerHTML来自页面域以外的域，出于安全原因，它似乎不会复制iframe的内容。

在我看来，目前的解决方案是像Zhertal建议的那样显示和隐藏时隙div，或者您可以找到其他方法将时隙div的内容实际移动到主板上，但这可能仍然违反了相同的安全考虑。我将继续挖掘，如果我发现更多的东西，我会编辑这个答案。

参考所以帖子：使用IFrame innerHTML获取JavaScript

Javascript