剪掉一些 iframe 的 src 内容

Question

我想使用 iframe 在我的网站中显示页面内容，但我想“剪掉”页面的标题（顶部）部分，省略其导航栏，因此用户只能看到下面的内容它。

代码：

<div id="content">
    <div style="height:800px;">
        <iframe id="optomaFeed" src="http://www.optomausa.com/company/press-releases/" scrolling="auto"
            frameborder="0" height="100%" width="100%"></iframe>
    </div>
</div> 

我可以采取哪些方法来做到这一点？泰姆~

Answer 1

我想出了如何使用 css clip 属性来做到这一点：

<div id="content">
    <div style="height:800px;">
        <iframe id="optomaFeed" src="http://www.optomausa.com/company/press-releases/" scrolling="no"
            frameborder="0" height="100%" width="100%" style="position:absolute; clip:rect(190px,1100px,800px,250px);
            top:-160px; left:-160px;"></iframe>
    </div>
</div>

Answer 2

如果导航栏容器有一个id，您可以在 javascript 中获得对它的引用，然后在其上调用parentNode.removeChild()。这意味着每次在 iframe 中更改页面时，导航栏可能会闪烁一秒钟。

或者，您可以通过加载 iframe 的服务器端脚本传递 iframe 的加载，去除导航栏的 HTML，然后输出结果。这可能会减慢用户与页面的交互，因为这意味着所有内容实际上都需要加载两次。如果你打算采用这种方法，你可能需要添加一个<base> 标签，这样你就不会破坏 CSS/JS。