如何在框架文件的"body"中加入<script>？

Question

通常我们将 JavaScript <script> 标签放在 HTML 文档的底部，就在结束的 </body> 标签之前，这样做的好处是它们会被执行在所有元素都已在 DOM and some more things.

中可用之后

但是，我使用的 frame document¹ 确实有 <frameset> 而不是<body> 标签。我不想将它们放在文档的 <head> 中，因为它们无法立即访问 ³ 下面的 DOM 元素。我也不想在标准正文标签中使用 <iframe>s⁴。我试过了

<head>
  <title>Framesets are interesting</title>
</head>
<frameset cols="50%,50%">
  <frame id="frame-a" src="a.html">
  <frame id="frame-b" src="b.html">
  <script type="text/javascript">
    console.log("hello world!");
    console.log(document.getElementById("frame-a")); // this is what I'm after
  </script>
</frameset>

然而，脚本根本没有执行，它甚至没有出现在 DOM 检查器中。当然，<frameset> 可能只包含 <frame> 和 <noframes> 标签。但是，真的没有办法让脚本在 <frame> 标签后执行吗？

仅供参考，将它们放在</frameset> like it's sometimes done with <body>s之后也不行。

_{1：是的，我知道它们已被弃用。它们是我项目的自然选择²，一个简洁的并排视图显示两个文档并以复杂的方式将它们滚动在一起。

2: …而且我以前从未使用过它们，所以我想试一试。

3：这就是我最终得到的，毕竟一个 onload 处理程序是微不足道的。问题依然存在，我很好奇

4：工作正常，但需要复杂的 CSS 样式}

Answer 1

这里解决了类似的问题：Dynamically set frame src using javascript

<head>
  <title>Framesets are interesting</title>
  <script type="text/javascript">
  function LoadPage(){
    console.log("hello world!");
    console.log(document.getElementById("frame-a")); // this is what I'm after
  }
  </script>
</head>
<frameset cols="50%,50%" onload="LoadPage();">    
  <frame id="frame-a" src="a.html">
  <frame id="frame-b" src="b.html">
</frameset>

Answer 2

<script> 元素只能出现在 <head> 元素或 <body> 元素中。它不能作为 <frameset> 元素的子元素出现； a <frameset> 只能包含 <frame> 个元素、<noframes> 个元素或其他 <frameset> 个元素。见 Transitional DTD:

<!ELEMENT FRAMESET - - ((FRAMESET|FRAME)+ & NOFRAMES?) -- window subdivision-->

通常情况下，浏览器很乐意将元素插入到它们不属于的其他元素中，这完全违背了 DTD 所说的内容，因为 DTD 只是一本规则手册，但这并不总是发生（例如，您永远不能将任何其他流元素放入 HTMLParagraphElement 无论您多么努力)，所以如果浏览器拒绝将 HTMLScriptElement 放入 HTMLFrameSetElement，很可能就是这个原因。

任何解决方法都涉及将 <script> 元素放置在框架集的 <head> 元素中，或放置在其中一个框架中。（您也可以在 <noframes> 元素中放置一个 <script> 元素，因为 <noframes> 与 <body> 具有相同的内容模型，但是由于显而易见的原因，这不会解决您的问题。 )

Answer 3

您可以通过插入带有数据 URI 的框架来放置脚本：

<head>
  <title>Framesets are interesting</title>
</head>
<frameset cols="50%,50%">
  <frame id="frame-a" src="a.html">
  <frame id="frame-b" src="b.html">
  <frame src="data:text/html,<script type='text/javascript'>with(parent) {
    console.log('hello world!');
    console.log(document.getElementById('frame-a'));
  }</script>">
</frameset>

当然，你需要小心引号，脚本会运行在另一个领域。您可以使用 parent 或 top 来访问外部文档的 window。

如何在框架文件的"body"中加入<script>？

How to put a <script> in the "body" of a frameset document?

html

javascript

frames

frameset

script-tag