CSS樣式是否應用於頁面加載後添加的標記？

我正在學習Javascript和CSS，並遇到一個問題，我的CSS樣式沒有應用於標記，我從XML動態生成並在頁面加載後寫入文檔。我只能假定這些樣式沒有被應用，因爲我在文檔被加載後修改了它。它是否正確？如果情況並非如此，您是否有任何想法瞭解爲什麼樣式未被應用？CSS樣式是否應用於頁面加載後添加的標記？

這段JavaScript代碼...

$(function() 
{ 
    //Dynamically generate markup 
    strMarkup = GenerateMarkupFromXML(); 

    //Display the dynamically generated markup 
    document.write(strMarkup); 
});

動態生成這種簡單的標記......

<div id="accordion"><h3>Title1</h3><h3>Title2</h3></div>

但這些款式永遠不似乎被應用，<h3>標籤一下就顯示與默認的瀏覽器風格...

h3 
{ 
    background-color:#ccc; 
    color:#003300; 
    font-size:1.1em; 
}

我還應該注意th當我將動態生成的標記直接粘貼到主體中時，樣式會正確應用。

在此先感謝您的幫助！

來源

2009-09-22 BeachRunnerFred

是...樣式將應用於任何動態添加的標記。

您的代碼的document.write（）部分可能會導致問題。一般來說，只應在文檔加載和解析時使用內聯document.write（）。如果你在DomReady上調用它，那麼它會覆蓋整個頁面，我猜這是導致問題的原因。我還沒有測試過。

我不是那熟悉的jQuery，但不是執行document.write（）行嘗試做沿東西線（未經測試）：

$（「身體」）追加（」 < DIV ID = 「手風琴」 > <H3>標題1/H3 > <H3>標題2 </H3 > < /格>「）;

來源

2009-09-22 21:25:20

是固定的，謝謝！ – BeachRunnerFred 2009-09-22 21:37:09

是的，CSS樣式應用於頁面加載後添加的標記。

這可能是因爲您實際上並沒有生成與您認爲相同的代碼。嘗試選擇生成的代碼並在Firefox中執行「查看選擇源代碼」。這會向您顯示生成的源代碼（即，不僅僅是加載頁面時提供的靜態內容）。

編輯

我覺得這是與使用document.write（）在文檔準備功能的問題..似乎導致某種無限循環的（我在Firefox，瀏覽器會將紡紗該選項卡上的加載圖標，即使該文件位於本地計算機上）。 $('body').append(strMarkup);solution posted by Andy工程，雖然，$('body').html(strMarkup);;

來源

2009-09-22 21:25:13 Kip

是的，CSS自動應用。你的例子不工作，因爲document.write是邪惡的）它使用你的自定義樣式重寫整個文檔，我建議。如果您想使用document.write，請在文檔的適當部分調用它，而不是在頭部。例如：

<頭> <風格> H3 { 背景色：#CCC; 顏色：＃003300; font-size：1.1em; } < /風格> < /頭> <體> <腳本> 文件撰寫（」 < DIV ID = 「手風琴」> < H3>標題1 </H3> < H3>標題2 </H3> </div>'）; </SCRIPT> </BODY>

來源

2009-09-22 21:34:26 Anatoliy

CSS樣式是否應用於頁面加載後添加的標記？

回答

相關問題