Html 剪掉一些 iframe 的 src 内容
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7183192/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Cutting out some of the iframe's src content
提问by Nick Rolando
I want to display a page's content in my website using an iframe, but I want to "cut out" the header (top) portion of the page, leaving out its navigation bar, so the user can only see what is underneath it.
我想使用 iframe 在我的网站中显示页面的内容,但我想“剪掉”页面的标题(顶部)部分,省略其导航栏,因此用户只能看到它下面的内容。
Code:
代码:
<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>
What are some ways I can go about doing this? Tyvm~
我有哪些方法可以做到这一点?tyvm~
回答by Nick Rolando
I figured out how to do it using css clip
attribute:
我想出了如何使用 cssclip
属性来做到这一点:
<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>
回答by DaveRandom
If the nav bar container has an id
you could get a reference to it in javascript, then call parentNode.removeChild()
on it. This would mean the nav bar would likely flash up for a second every time the page was changed within the iframe.
如果导航栏容器有一个,id
您可以在 javascript 中获得对它的引用,然后调用parentNode.removeChild()
它。这意味着每次在 iframe 中更改页面时,导航栏可能会闪烁一秒钟。
Alternatively, you could pass the loading of the iframe through a server-side script that loads it, strips out the HTML for the nav bar, then outputs the result. This would probably slow down the user's interaction with the page, since it would mean everything effectively required loading twice. If you are going to take this approach you would probably need to add a <base>
tag so you don't break the CSS/JS.
或者,您可以通过加载 iframe 的服务器端脚本传递 iframe 的加载,去除导航栏的 HTML,然后输出结果。这可能会减慢用户与页面的交互,因为这意味着所有内容都需要加载两次。如果你打算采用这种方法,你可能需要添加一个<base>
标签,这样你就不会破坏 CSS/JS。