有没有办法在每个 iframe 中获取 parent css link rel？

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 中获取 parent css link rel？

Is there a way to get parent css link rel inside every iframe?

css

iframe

jquery

parent