为什么我这样动态加载css文件不成功？？？大家是怎么动态加载的？？？？

下面这样不行
<DL id=AccordionMulti class=AccordionMulti><DL>
<DT class=stretchtoggle><B>first section</B> 
<DD style="FILTER: ; PADDING-BOTTOM: 0px; MARGIN-TOP: 0px; DISPLAY: none; MARGIN-BOTTOM: 0px; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; VISIBILITY: visible; OVERFLOW: visible; PADDING-TOP: 0px; opacity: 1; totalHeight: 18; computedTop: 0; computedBottom: 0" class=stretcher>I'm the content for the first section. </DD>
<DT class=stretchtoggle><B>second section</B> </DT>
<DD style="POSITION: static; FILTER: ; PADDING-BOTTOM: 0px; MARGIN-TOP: 0px; ZOOM: 1; DISPLAY: none; MARGIN-BOTTOM: 0px; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; VISIBILITY: visible; OVERFLOW: visible; PADDING-TOP: 0px; opacity: 1; totalHeight: 18; computedTop: 0; computedBottom: 0" class=stretcher>I'm the content for the second section. </DD>
<DT class=stretchtoggle><B>third section</B> </DT>
<DD style="POSITION: static; FILTER: ; PADDING-BOTTOM: 0px; MARGIN-TOP: 0px; ZOOM: 1; DISPLAY: none; MARGIN-BOTTOM: 0px; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; VISIBILITY: visible; OVERFLOW: visible; PADDING-TOP: 0px; opacity: 1; totalHeight: 18; computedTop: 0; computedBottom: 0" class=stretcher>I'm the content for the third section. </DD></DL></DL>
<script defer=defer>
var a=document.createElement('style');
var b=document.createTextNode('@import url("http://www.clientcide.com/css/clientside.css")')
a.appendChild(b);
document.body.appendChild(a);</script>  下面是一般加载 不是动态的  可以成功
<style>
@import url("http://www.clientcide.com/css/clientside.css");</style>

解决方案 »

  1.   

    var head = document.getElementsByTagName('HEAD').item(0);
    var style = document.createElement('link');
    style.href = 'http://www.clientcide.com/css/clientside.css';
    style.rel = 'stylesheet';
    style.type = 'text/css';
    head.appendChild(style);
      

  2.   

    2楼正解
    但是能不能动态加载<style> 标签呢？？
    谁成功加载过吗？
      

  3.   

    动态加载Style<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
      <title> new document </title>
     </head> <body>
      <script type="text/javascript">
      <!--
    var oHead = document.getElementsByTagName("head")[0];
    var oStyle = document.createElement("style");
    oStyle.type="text/css";
    oHead.appendChild(oStyle); var oCss = document.styleSheets[0];
    oCss.cssRules ? (oCss.insertRule("div{width:200px;height:300px;border:2px solid red;}",oCss.cssRules.length )) : oCss.addRule("div", "width:200px;height:300px;border:2px solid red;");
      //-->
      </script>
      <div></div>
     </body>
    </html>
      

  4.   

    有一个问题 我加下面这句 在head body 甚至是html外都可以正确显示
    <link href="http://www.clientcide.com/css/clientside.css" rel="stylesheet" type="text/css"/>但是 我把http://www.clientcide.com/css/clientside.css里面的内容全部复制下来 
    放到<style>标签中 却不能正确显示  我是在ie8下测试的   为什么会这样？？？？@5楼
    只能用insertRule 或addRule加入css字符串而不能加入 css文件吗？？？
      

  5.   

    如果引入css文件 2楼的就可以  你只能自己慢慢找出问题所在了...
      

  6.   

    下面这样 不行吧  
     oCss.cssRules ? (oCss.insertRule("@import url('http://www.clientcide.com/css/clientside.css');",oCss.cssRules.length )) : oCss.addRule("", "@import url('http://www.clientcide.com/css/clientside.css');");
      

  7.   

    汗死！干吗呢？
    觉得有必要用@import url吗？
    了解@import吗？
      

  8.   

    cnblog 好像能清楚 link标签 动态添加link也达不到自己要的效果
    所以只好试试这样 看行不行 感觉也不行