如何動態創建div，同時將其引用到類中？

在這裏搜索得很遠，但似乎無法找到答案！這是作業！所以我不期望任何人爲我寫任何東西，只是爲了幫助我:)如何動態創建div，同時將其引用到類中？

我正在嘗試使用一個帖子按鈕有一個HTML消息框。點擊發布按鈕後，該消息與日期一起發佈到下面的div中。這可以做很多次，最新的發表在最古老的發表。我嘗試的方法是每次創建一個新的div，並將它們全部分配給我的CSS文檔中的同一個類。消息和日期必須分配在單獨的'p'標籤中，並分配了自己的類別。如果有人知道一個更好的方法，我是全部耳朵。雖然，我的JavaScript文檔必須是外部的。

我現在有這樣的代碼：

function createComment(){ 
var message = ""; 
var divTag = document.createElement("div"); 
divTag.className = "commentDiv"; 
divTag.innerHTML = Date(); 
message=document.getElementById("textBox").value; 
document.getElementById("comments").innerHTML=message; 
}

我試圖創建DIV，然後給它「commentDiv」的ID，因爲這是我的CSS文檔中的DIV的ID已經風格。然後我在內部HTML中發佈日期，並將文本框中的值保存到名爲'message'的變量中。然後，我嘗試嘗試將消息打印到ID爲'comments'的段落標記中。我是非常新的網絡Javascript。說實話，我真的不知道我在做什麼哈哈。非常感謝所有幫助。謝謝！

來源

2013-02-14 Fizzix

使用'id'而不是'className'？ – 2013-02-14 03:02:55

如果我使用ID，那麼每個頁面只能創建一個div。 – Fizzix 2013-02-14 03:04:01

然後你的風格規則不能適用於那個div – 2013-02-14 03:15:59

我想你在找什麼東西像

var ct = document.getElementById('comments') 

function create(){ 
    var divTag = document.createElement('div'); 
    divTag.className = 'comment'; 

    var p1 = document.createElement('p'); 
    p1.className = 'date'; 
    p1.innerHTML = new Date(); 
    divTag.appendChild(p1) 

    var p2 = document.createElement('p'); 
    p2.className = 'message'; 
    p2.innerHTML = 'nop'; 
    divTag.appendChild(p2); 

    ct.appendChild(divTag); 
}

演示：Fiddle。

appendChild()可用於將子元素追加到節點。

來源

2013-02-14 03:18:12

'divTag'沒有定義 – sevaor 2013-02-14 03:27:05

[小提琴]（http://jsfiddle.net/Bnqyb/1/） – sevaor 2013-02-14 03:29:38

哇！這正是我需要的。非常感謝你的幫助！ – Fizzix 2013-02-14 04:51:45

如何動態創建div，同時將其引用到類中？

回答

相關問題