是否有可能改变一个div的风格,居住在一个iframe在页面上使用CSS只?
当前回答
是的,这是可能的,尽管很麻烦。您需要将页面的HTML打印/回显到页面主体中,然后应用CSS规则更改函数。使用上面给出的相同示例,本质上是使用在页面中查找div的解析方法,然后对其应用CSS,然后将其重新打印/回显给最终用户。我不需要这个,所以我不想把这个函数编码到另一个网页的CSS中的每一个项目中,只是为了适应。
引用:
IFRAME打印内容 使用PHP或JavaScript访问和打印HTML源代码 http://www.w3schools.com/js/js_htmldom_html.asp http://www.w3schools.com/js/js_htmldom_css.asp
其他回答
简而言之,没有。
您不能将CSS应用于iframe中加载的HTML,除非由于跨域资源限制,您可以控制iframe中加载的页面。
是的。看看另一个线程的细节: 如何将CSS应用到iframe?
const cssLink = document.createElement("link");
cssLink.href = "style.css";
cssLink.rel = "stylesheet";
cssLink.type = "text/css";
frames['frame1'].contentWindow.document.body.appendChild(cssLink);
// ^frame1 is the #id of the iframe: <iframe id="frame1">
结合不同的解决方案,这对我来说是有效的。
$(document).ready(function () {
$('iframe').on('load', function() {
$("iframe").contents().find("#back-link").css("display", "none");
});
});
从客户端不可能。一个javascript错误将被提出“错误:权限拒绝访问属性“文档””,因为Iframe不是你的域的一部分。 唯一的解决方案是从服务器端代码中获取页面并更改所需的CSS。
就像尤金说的,一种粗鄙的做事方式。我最终遵循他的代码,并链接到我的自定义Css页面。我的问题是,有了twitter的时间轴,你必须做一些回避twitter来覆盖他们的代码一点点。现在我们有一个滚动的时间轴与我们的css,即更大的字体,适当的行高和使滚动条隐藏的高度大于他们的限制。
var c = document.createElement('link');
setTimeout(frames[0].document.body.appendChild(c),500); // Mileage varies by connection. Bump 500 a bit higher if necessary