提问人：xyz 提问时间：12/1/2008 最后编辑：xyz 更新时间：12/2/2008 访问量：650
在运行时更改嵌套页面的样式表
Changing the stylesheet of a nested page at runtime
问：
首先，如果这没有意义，我深表歉意。我是XHTML，CSS和JavaScript的新手。
我在XHTML中收集到，拥有嵌套页面的正确方法如下（而不是iframe）：
<object name="nestedPage" data="http://abc.com/page.html" type="text/html"
width="500" height="400" />
如果我有一个这样的嵌套页面 - 是否可以在运行时使用父页面中的 JavaScript 更改嵌套页面使用的样式表？理想情况下，这将立即发生，以便嵌套页面永远不会在其原始样式表中可见。
请假设您无法控制嵌套页面的原始源代码，但它位于同一域中（不要问）
答：
0赞
Javache
12/1/2008
#1
如果嵌套页面在您的域之外，恐怕跨域限制会阻止您摆弄其样式表/html。
0赞
Pim Jager
12/1/2008
#2
如果嵌套页面位于另一个域上，则是不可能的，由于 SOP（同源策略），javascript 不允许访问它
0赞
Vilx-
12/1/2008
#3
好吧，我可能很傻，但你不用做这样的事情吗？<iframe>s
评论
0赞
nsdel
12/1/2008
XHTML Strict 不支持 iframe。<object> 改用。
2赞
Javache
12/1/2008
#4
我建议为此使用 iframe，我不知道是否也支持这样做的对象方式。
无论如何，在加载来自同一域的页面后，您可以通过 javascript 访问其所有属性。 例如，在 jQuery 中，您将用于更改 css 文件。
$("link [rel=stylesheet]", myFrame).attr('href', <new-url>);
替换为 myFrame，这是对 iframe 对象的引用。
4赞
nsdel
12/1/2008
#5
d = document.getElementsByTagName('object').namedItem('nestedPage').getContentDocument();
d.styleSheets[d.styleSheets.length].href = 'whereever';
警告：尚未在所有浏览器中进行测试。
1赞
mahemoff
12/2/2008
#6
几点提示。
我前段时间对此进行了一些研究，发现了一些棘手的浏览器问题，并在 Quirksmode 和 IIRC Dojo 邮件列表上发现了一些很好的解决方案和建议。它导致了以下库函数来应用 CSS，我已经在主要浏览器中测试过：
function applyCSS(css) {
// http://www.quirksmode.org/bugreports/archives/2006/01/IE_wont_allow_documentcreateElementstyle.html
if (BrowserDetect.browser=="Safari" || BrowserDetect.browser=="Opera") { /* good for FF too */
var styleNode = document.createElement("style");
styleNode.setAttribute("type", "text/css");
styleNode.appendChild(document.createTextNode(css));
head.appendChild(styleNode);
} else {
var div = document.createElement("div");
div.innerHTML = "<p>x</p><style>"+css+"</style>";
document.body.appendChild(div.childNodes[1]);
}
}
如果你最终在 iframe 中这样做，这个技巧可能会有所帮助（来自 TiddlyWiki 代码）：
var doc = iframe.document;
if(iframe.contentDocument)
doc = iframe.contentDocument; // For NS6
else if(iframe.contentWindow)
doc = iframe.contentWindow.document; // For IE5.5 and IE6
// Put the content in the iframe
doc.open();
doc.writeln(content);
doc.close();
上面的代码生成一个新的 iframe，其中包含一些内容。如果您只输出一次 iframe，并且已经了解 CSS，则可以在输出 iframe 时向下发送标签。
1赞
Kent Brewster
12/2/2008
#7
如果我们在同一个域中，请使用 XMLHTTPRequest 加载它，使用 innerHTML 将响应文本猛烈抨击到隐藏的 DIV 中，将隐藏 div 的 BODY 节点克隆到您想要内容的任何位置，然后删除隐藏的 div。
评论