動態地改變IE和Firefox

不工作的樣式表路徑，我有以下文件：動態地改變IE和Firefox

<html> 
<head> 
<title></title> 
<link rel="css" type="text/css" href="/empty.css" title="css" /> 
<script type="text/javascript" src="/Prototype"></script> 
<script type="text/javascript"> 
function load_content() 
{ 
    var d = new Date(); 
    new Ajax.PeriodicalUpdater('content', '/DOC?'+d.getTime(), 
    { 
    method: 'post', 
    frequency: 5, 
    onSuccess: function(transport) { 
      for(i=0; (a = document.getElementsByTagName('link')[i]); i++) 
      { 
       if(a.getAttribute('rel') == 'css' && a.getAttribute("type") == 'text/css') 
       { 
        a.href = '/CSS?'+d.getTime(); 
       } 

      } 
    } 
    }); 

} 
</script> 

</head> 

<body> 

<div id="content"></div> 

<script type="text/javascript"> 
    load_content(); 
</script> 

</body> 
</html>

注：忽略d.getTime（）調用......這些都只是得到解決的問題與IE不從AJAX調用加載新頁面，因爲它的緩存方案過於激進。

基本上，當它在/ DOC上重新加載文件時，它應該將當前樣式表設置爲/ CSS處的文件... DOC和CSS都在不斷變化。

奇怪的是，在Chrome中，它的工作效果很好。 DOC加載到「內容」div中，樣式表被設置爲CSS，並將該CSS應用於頁面。我可以使用CSS頁面更改5秒，當頁面刷新時，CSS也會刷新。

但是在IE和Firefox中，HTML會加載，我可以看到樣式錶鏈接的href屬性變爲「/ CSS + getTime（）」，但是當HTML加載時，css是從來沒有適用於該頁面。我甚至可以改變DOC的內容並更新它，但是這個CSS永遠不會被應用。它只是一個沒有風格的頁面。

Firefox和IE不支持以這種方式更改樣式表引用嗎？有沒有更好的方法來做到這一點？

來源

2009-01-12 Adam Haile

而不是在單個鏈接中更改工作表，請嘗試使用備用樣式表。有關使用備用樣式表此鏈接：

http://www.alistapart.com/articles/alternate/

來源

2009-01-12 15:47:08

也許這將幫助你...... http://www.javascriptkit.com/javatutors/loadjavascriptcss.shtml

function loadjscssfile(filename, filetype){ 
if (filetype=="js"){ //if filename is a external JavaScript file 
    var fileref=document.createElement('script') 
    fileref.setAttribute("type","text/javascript") 
    fileref.setAttribute("src", filename) 
} 
else if (filetype=="css"){ //if filename is an external CSS file 
    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) 
}

來源

2009-01-12 15:42:16 Moran

-1

這可能是一個緩存的問題。如果您進行了硬刷新（FF中的Ctrl + R，IE中的Ctrl + F5），它是否正確顯示樣式？如果確實解決了這個問題，您可能需要考慮從CSS文件中刪除Last-Modified標頭，或者添加一個緩存控件標頭，告訴瀏覽器不要緩存它。

來源

2009-01-12 15:43:14 palehorse

它看起來像你每次只需重新加載現有頁面。爲什麼不使用頭中的刷新標籤來強制每次重新加載文檔並放入CSS和內容服務器端。簡單得多，即使禁用了JavaScript，它也可以工作。

<meta http-equiv="refresh" content="5;url=http://example.com/DOC" />

來源

2009-01-12 15:49:53 tvanfosson

通過javascript包含文件的最佳方式是插入一個新的dom元素。

var a = document.createElement('link'); 
a.href="inset.css"; 
a.rel="stylesheet"; 
document.getElementsByTagName("head")[0].appendChild(a);

但是，很顯然你要碰上雖然問題是，一旦文件被加載完Firefox和IE不會重新繪製畫布（和你正在使用AJAX）。你解決這個問題的方式是通過獲取樣式表的內容並將它們包含在一個樣式元素中。此示例代碼將動態更改頁面上的顏色。

function onLoadFunction() { 
    var a = document.createElement('style'); 
    a.appendChild(document.createTextNode('body {color: blue;}')); 
    document.getElementsByTagName("body")[0].appendChild(a); 
}

加載新工作表時，只需銷燬樣式元素中的css並將其替換即可。

來源

2009-01-12 15:59:08 jacobangel

有趣... 2件事。創建元素後，如何訪問和更改CSS？我沒有線索。其次...我周圍搜索，發現一堆地方說，document.createElement（'鏈接'）將無法在IE瀏覽器...有沒有其他方法？ – 2009-01-12 16:41:51

動態地改變IE和Firefox

回答

相關問題