javascript - 在javascript中选择两个没有id的iframe之一

Question

如何使用以下代码在页面上选择 2 个 iframe 中的 1 个？

window.onload = function() {
   let frameElement = document.getElementsByTagName("iframe");
   let doc = frameElement.contentDocument;
   doc.body.innerHTML = doc.body.innerHTML + '<style>.start-screen-search__sub-title:after {content: \' online below, or call: XXX\'; font-size: 22px;}</style>';
}

Answer 1

您可以通过 frameElement 变量上的索引访问第二个 iframe。由于您使用的是 getElementsByTagName，因此您将拥有一个可以按索引访问的元素的节点列表。

window.onload = function() {
   let frameElement = document.getElementsByTagName("iframe");
   console.log('should be cnn.com iframe', frameElement[1]);
   let doc = frameElement[1].contentDocument || frameElement[1].contentWindow; // <-- select the 2nd iframe
   doc.body.innerHTML = doc.body.innerHTML + '<style>.start-screen-search__sub-title:after {content: \' online below, or call: XXX\'; font-size: 22px;}</style>';
}

<iframe src="https://yahoo.com"></iframe>
<iframe src="https://cnn.com"></iframe>

这是一个如何在 iframe 中设置 html 内容的基本示例。 (SOF 不允许你在他们的代码编辑器中这样做，所以这里有一个 js fiddle)

https://jsfiddle.net/mswilson4040/hfy1mju7/1/