使用javascript/DOM創建HTML正文

好的，基本上我想將body標記的一部分存儲在variable的function中，然後調用正文中的函數來創建該部分HTML。這裏是我的功能代碼：使用javascript/DOM創建HTML正文

function RadioButtonContent() 
{ 
var rbc = '<h3>Type your radio button here:</h3><input type="text" name="option" id="option" value="Example 1" /><button id="AddButton" onclick="radio()">Add</button><button id="RemoveButton">Remove</button><div id="updateDivRadio"><h1>Space for Radio Button</h1></div>' 
var rbcAppen = document.getElementById('radioButton'); 
rbc.appendChild.rbcAppen; 
}

但它不會做任何事情的時候叫......可能是DOM不起作用這種方式還是有圍繞一個辦法嗎？ Here's小提琴。

請幫

來源

2014-03-31 envyM6

如果您想要這樣做，您可能需要使用['innerHTML']（https://developer.mozilla.org/en-US/docs/innerHTML）屬性。 – Seiyria

是的，我有一種感覺，可能是這樣的...任何想法如何？ @Seiyria – envyM6

我會用我的聲明和下面的答案混合使用，我會稍後發佈。 – Seiyria

你可以做一個新節點，設置它的HTML，像這樣：

var newNode = document.createElement("div") 
newNode.innerHTML = rbc; 
rbcAppen.appendChild(newNode);

這裏有一個小提琴：http://jsbin.com/cebikuxi/1/edit

來源

2014-03-31 17:22:15 Seiyria

[Here]（ http://jsfiddle.net/nadz006/WYf3G/1/）是你的代碼@Seiyria的小提琴......不工作:( – envyM6

我得到'未捕獲的ReferenceError：RadioButtonContent未定義'在你的小提琴上，我看到我是否可以得到一個修復 – Seiyria

@Seiriya我正在使用鉻和沒有錯誤 – envyM6

見https://developer.mozilla.org/en-US/docs/Web/API/document.createTextNode

// For text only 
rbcAppen.appendChild(document.createTextNode(rbc)) 

// If you can overwrite the HTML in rbcAppen 
rbcAppen.innerHTML = rbc; 

// If you can't overwrite the HTML, create a temporary node, add 
// the content there and append the nodes to your rbcAppen 
var tempNode = document.createElement("div"); 
tempNode.innerHTML = rbc; 
while (tempNode.childNodes.length) { 
    rbcAppen.appendChild(tempNode.childNodes[0]); 
}

Working code

來源

2014-03-31 17:16:40

感謝.. 'rbcAppen.appendChild（document.createTextNode（RBC））'的作品，但它不把內容作爲HTML元素和標籤，而是把它們只是作爲純文本，這是不是我的意圖... – envyM6

@ envyM6我已更新答案，涵蓋其他案件 –

感謝您的建議，以及:) – envyM6

使用javascript/DOM創建HTML正文

回答

相關問題