有沒有一種簡單的方法來document.createElement多個元素？

當您創建一組元素時，是否存在JS中的簡寫方法document.createElement。有沒有一種簡單的方法來document.createElement多個元素？

爲了最大限度地提高HTML5的使用，而且還使網站在舊的瀏覽器，我傾向於有一些像每個站點的這個片段JS的我做的：

// Allows HTML5 tags to work in older browsers 
document.createElement('header'); 
document.createElement('nav'); 
document.createElement('section'); 
document.createElement('article'); 
document.createElement('aside'); 
document.createElement('footer');

有沒有辦法通過將它們加入到一個語句 - 逗號分隔或類似的東西？

來源

2011-04-25 Keefer

var elements = ['header', 'nav', 'section', 'article', 'aside', 'footer']; 
for (var i = 0; i < elements.length; i++) { 
    document.createElement(elements[i]); 
}

來源

2011-04-25 20:37:17 Quentin

我知道你沒有要求它，但jQuery使這很容易。

var $elems = $("<header/><nav/><section/><article/><aside/><footer/>"); 
$("header", $elems).html("Sweeeeet!"); 
// etc...

基本上我剛剛做了創建6個DOM元素並返回他們到一個jQuery對象（類似於一個節點列表，我想）。然後，我可以對這些項目採取行動，但是我選擇，甚至遍歷它們：

$elems.each(function(){ /* Loopy stuff */ });

當然，不要忘了其實它們添加到

$("body").append($elems);

查看文檔也templates不如此醜陋的dom世代和內置工具。

來源

2011-04-25 20:42:16

應該真的是這樣的清潔方法，目前我使用的是簡單的：

function elem(type, klass, content){ 
    var el = document.createElement(type); 
    if(klass) el.className = klass; 
    if(content) el.innerHTML = content; 
    return el; 
} 

// usage : var div = elem('div','myclass','123');

它實際上會更好，如果ES給了這個簡寫...... 或許真的在喜歡...

var div = new Div(setup...);

來源

2017-01-16 07:53:05 levi

有沒有一種簡單的方法來document.createElement多個元素？

回答

相關問題