Question

我有一个页面，其主要样式表存储在css文件夹中。在同一页面内，我有多个iframe（位于另一个文件夹中，但位于相同的域中），我希望它们使用与父代相同的CSS。请告知，我对JS刚起步。

我尝试了以下代码，并且一切正常，唯一的问题是我现在有15个iframe，当然每个iframe都会增加15倍的代码。我不能在代码内使用ID，否则我将需要为每个ID设置脚本。

  <script type="text/javascript">
    $("iframe").on("load", function() {
      let head = $("iframe").contents().find("head");
      let css = '<link rel="stylesheet" href="../css/stylesheet.css">';
      $(head).append(css);
    });
  </script>

Answer 1

总是指第一个iFrame。更改代码以引用每个iframe，如下所示：

<script type="text/javascript">
    $("iframe").on("load", function() {
      let head = $(this).contents().find("head");
      let css = '<link rel="stylesheet" href="../css/stylesheet.css">';
      head.append(css);
    });
  </script>

有没有一种方法可以在每个iframe中获取父级CSS链接rel？

1 个答案: