如何更好地创建新元素？

Question

1. jQuery('body').append('<div id="my-div" style="background: #fff">my text</div>');
2. jQuery('<div/>').attr('id', 'my-div').css('background', '#fff').html('my text');
3. jQuery('<div/>', {id: 'my-div', html: 'my text', css: {background: '#fff'}});

那么最好的方法是什么？可能你还有别的吗？

Answer 1

第三种解决方案是最简洁,最容易阅读和扩展的,并且通常被认为是最干净的,尽管第二种解决方案不需要迭代属性,可能会更快一些.

第一个是较慢的,因为它要求浏览器解析HTML(并且因为它是唯一一个将元素添加到DOM,如Jan所注意到的).

这是性能测试:http://jsperf.com/add-element

但是你可以按照自己喜欢的方式做.即使速度差异在这里也很少见.