Iframe中的不同CSS

Question

我现正研究以下各点：

if (window.top!=window.self) { 
    <link rel="stylesheet" href="http://www.website.com/content/themes/theme/style.css" type="text/css" />
} else { 
    <link rel="stylesheet" href="http://www.website.com/content/themes/theme/iframe.css" type="text/css" />
}

我想添加链接的文件，所以当它加载到网站styles.css将载入，当它在一个框架内将加载frame.css，我做错了什么？

Answer 1

您将JavaScript与HTML混合在一起。这就是为什么会出现语法错误的原因。

您需要使用一个will load a CSS file函数

function loadCSSFile (filename) {
      var fileref = document.createElement("link");
      fileref.setAttribute("rel", "stylesheet");
      fileref.setAttribute("type", "text/css");
      fileref.setAttribute("href", filename);
      if (typeof fileref != "undefined");
         document.getElementsByTagName("head")[0].appendChild(fileref)
}

或者使用jQuery：

function loadCSSFile (filename) {
    $("<link>", {
         rel: "stylesheet"
       , type: "text/css"
       , href: filename
    }).appendTo("head");
}

然后你就会：

if (window.top!=window.self) { 
    loadCSSFile("http://www.website.com/content/themes/theme/style.css");
} else { 
    loadCSSFile("http://www.website.com/content/themes/theme/iframe.css");
}