Question

我有一个自动生成的iframe（在其中也有一个类名，并且在同一域中），里面还有一个<script>标签和一些样式。谁能告诉我如何使用纯JavaScript删除脚本标记及其内容？ [否jQuery ，请使用VueJS]

<html>
<body>
    <iframe src="#" class="myiframe">
        #document
        <html>
            <body>

                <!-- REMOVE-->
                <style>...</style>
                <!-- REMOVE-->

                <div class="wrapper">...</div>
            </body>
        </html>
    </iframe>
</body>
</html>

我知道如何选择脚本标签（可能并不完美），我不知道如何选择iframe内的样式标签：

var element = document.getElementsByTagName("style"), index;

for (index = element.length - 1; index >= 0; index--) {
    element[index].parentNode.removeChild(element[index]);
}

Answer 1

您可以尝试使用以下代码，该代码可能很长，请尝试对其进行优化：

cms/content/vendor/bin/phpunit

我从this link找到了一个参考。

除了您编写的代码外，我还添加了以下两行：

<html>

  <head>
    <script>
      function removeStyleTag() {
        var iframe = document.getElementById("myFrame");
        var styleTag = iframe.contentWindow.document.getElementsByTagName("style");

        for (var index = styleTag.length - 1; index >= 0; index--) {
          styleTag[index].parentNode.removeChild(styleTag[index]);
        }
      }

    </script>
  </head>

  <body>
    <iframe id="myFrame" src="#" class="myiframe">
        #document
        <html>
            <body>

                <!-- REMOVE-->
                <style>...</style>
                <!-- REMOVE-->

                <div class="wrapper">...</div>
            </body>
        </html>
    </iframe>
    <button onclick="removeStyleTag()">Try It</button>
  </body>

</html>

Here是我尝试过此代码的Fiddle的链接。

仅使用JavaScript删除iframe脚本代码

1 个答案: