的JavaScript，DOM：使用appendChild和的textContent

我提交了一個Firefox插件給Mozilla目錄，卻遭到了拒絕，因爲這樣的：的JavaScript，DOM：使用appendChild和的textContent

item.innerHTML = '<table style="border-collapse: collapse; width: 100%;">' 
        + '<tr><td style="line-height: inherit; padding: 0pt; width: 100%;">' 
        + word.title 
        + '</td></tr>' 
        + '</table>';

我跟編輯，他告訴我「use a text node and then insert it using appendChild, textContent, etc」

這聽起來像對我來說總是亂碼，我從來沒有使用過TextContent, appendChild等，有點失落。你能告訴我如何做到以上幾點，我將在腳本中編輯其他13個我有類似上述內容的實例嗎？

謝謝！

來源

2011-07-28 Ryan

他拒絕了它，因爲它可以使用這種技術注入HTML代碼。 – Pindatjuh

我知道，那是他告訴我的......我知道他爲什麼拒絕它，但不知道如何使用他告訴我使用的其他東西。雖然這似乎有點有用：http://stackoverflow.com/questions/2962137/adding-new-elements-into-dom-using-javascript-appendchild – Ryan

你可能需要沿着這些線路做一些事情：

var t = document.createElement("table"), 
    tb = document.createElement("tbody"), 
    tr = document.createElement("tr"), 
    td = document.createElement("td"); 

    t.style.width = "100%"; 

    // note the reverse order of adding child   
    tr.appendChild(td); 
    tb.appendChild(tr); 
    t.appendChild(tb); 

    // more code to populate table rows and cells 
    item.appendChild(t);

注：有警告，以創建一個表這樣的事情瀏覽器之間的工作方式不同。我建議諮詢MDN以確定FF。

來源

2011-07-28 21:37:22 Mrchief

你可以寫更多的代碼嗎？我已經找到了它，直到風格屬性只。其他方面的其他內容......對如何繼續進行了解甚少。 – Ryan

我更新了我的答案。檢查具有詳細示例的MDN鏈接。 – Mrchief

關閉標籤怎麼樣？而不是t.style.wide我不能t.style =「border-collapse：collapse; width：100％;」; – Ryan

他希望您以編程方式在JavaScript中創建HTML。以read of this post，它應該爲你清理一些事情。如果您想了解更多信息，請發表評論。

來源

2011-07-28 21:38:19

閱讀後，我更困惑:( – Ryan

與其使用innerHTML，他希望您使用更直接更改DOM的函數。 AppendChild

將節點添加到指定父節點的子節點列表的末尾。如果節點已經存在，它是從當前父節點刪除，然後添加到新的父節點

https://developer.mozilla.org/En/DOM/Node.appendChild。它的格式是：var child = element.appendChild(child);

在你的情況我會做：

var newText = document.createTextNode(word.title); 
locationInDom.appendChild(newText);

哪裏locationInDom就是你要使用的innerHTML。如果innerHTML進入一個表格，那麼只需在特定的現有列中添加一個id，然後使用方法getElementById並在該點添加即可。

來源

2011-07-28 21:44:08 scrappedcola

這是我的確切代碼http://pastebin.com/L6hZHDLT，在這個文件中只有兩個innerHTML thingies，你可以告訴/給我的代碼替換這兩個？ – Ryan

你真的需要一個表嗎？它是表格數據嗎？如果不是隻是用item替換locationInDom並使用item.appendChild（newText）; – scrappedcola

它不是我的代碼，所以我不想做許多更改，另一個開發人員，比我經歷的要多得多，但他生病了，我必須確保這通過了批准，否則我就搞砸了...... – Ryan

的JavaScript，DOM：使用appendChild和的textContent

回答

相關問題