有没有一种简单的方法来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');

有没有办法通过将它们加入到一个语句 - 逗号分隔或类似的东西？

答

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

答

我知道你没有要求它，但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世代和内置工具。

答

应该真的是这样的清洁方法，目前我使用的是简单的：

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...);

有没有一种简单的方法来document.createElement多个元素？

相关推荐