如何使用javascript滚动到iframe中的特定位置答案

【问题标题】：How to scroll to a specific location in iframe with javascript如何使用javascript滚动到iframe中的特定位置
【发布时间】：2016-12-24 16:57:45
【问题描述】：

我有一个页面A.html，通过iframe嵌入页面B.html。

A.html

<Html>
  <Head>
   <Title> A.html </title>
  </Head>
  <Body>
   <Iframe name = "myframe" id = "myframe" src = "B.html" frameborder = "0"/> 
 </Body>
</Html>

B.html

<Html>
 <Head>
  <Title> B.html </title>
   <Style type = "text/css" media = "screen">
    .body {margin: 0px 0px 0px 0px; font-size: medium;}
  </Style>
 </Head>
  <Body class = "body">
    <Table  width = "100%" height = "100%" align = "left" cellspacing = "0" cellpadding = "0">
      .
      .
   </Table>
   <Table  width = "100%" height = "100%" align = "left" cellspacing = "0" cellpadding = "0">
      The content I want to display!
   </Table>
   <Table  width = "100%" height = "100%" align = "left" cellspacing = "0" cellpadding = "0">
     .
     .
   </Table>
   </Body>
   </Html>

我想在A.html中显示B.html的table2内容，我找到了一些方法，比如

 var myIframe = document.getElementById('myframe');
  myIframe.onload = function(){
      myIframe.contentWindow.scrollTo(100,500);
  };

但是B.html页面大小没有设置，有三个表格，height="100%"，B.html显示为百分比页面，它在浏览器中滚动到三个页面。所以 scrollTo(x,y) 方法不起作用，有什么好的方法吗？非常感谢！

【问题讨论】：

A.html 是我的页面，B.html 不是我的页面，它在另一个服务器中
将 iframe src 的 url 设置为 B.html/#table2 很确定可以将其滚动到表 2 的元素 ID 或设置您希望滚动到的任何 #ElementId？
谢谢，但是真正的B.html中没有table id，而且B.html不是我的页面，我改不了。还有其他方法吗？
在 B.html 中，您在这里清楚地显示了表格的 id... -- id = "table2" width = "100%" 那么，如果您要使用的实际页面没有，为什么您的示例源有一个 ID...您能否提供一个更好的示例来说明您将使用的页面，也许您会得到一个合适的回答。

原谅我，我担心我们无法区分哪一张表，所以我添加了表id。我已经将它恢复为原来的，B.html是这样的，除了数据内容每张桌子。

标签： javascript html iframe

【解决方案1】：

您可以滚动到任何设置了 id 的 HTML 元素的位置。

所以，如果有表<table id="my-table">，您可以使用锚链接转到它。
<a href="#my-table">go to table</a>

iframe 中的内容也是如此。
将您的来源设置为您想要的网址，并在末尾添加#my-table（或类似的东西）。

在下面的 sn-p 中，我使用了一个 iframe，它直接指向 Stackoverflow.com 主页的 #footer。

.myframe {
  height: 320px;
  width: 480px;
}

&lt;iframe class="myframe" src="http://www.stackoverflow.com#footer"&gt;&lt;/iframe&gt;

【讨论】：

但是使用锚点意味着您必须将锚点添加到 B.html 中，就像您只是设置/更改 iframe 的 src 然后您不需要添加更多内容到iframe 页面。您基本上提供的解决方案不是 OP 所要求的，然后重复我上面的评论。
谢谢，但是真正的B.html中没有table id，而且B.html不是我的页面，我改不了。还有其他方法吗？