jquery - 如何简化我的创建元素代码？

Question

我正在尝试创建 2 个元素，1 个带有 id，1 个没有。我有以下代码，想知道如何简化它。有什么帮助吗？非常感谢。

 var element = $('<div/>').attr({'id': tool}).addClass('s-Tool')             
                .append(
                  $('<div/>').css({'padding': '0.5em 1em'}).html(text)
               );

//only different is attr id

 var elementClass = $('<div/>').addClass('s-Tool')             
                .append(
                  $('<div/>').css({'padding': '0.5em 1em'}).html(text) 
               );

Answer 1

var elementClass = $('<div />', {'class': 's-Tool'})
                   .append($('<div/>').css('padding', '0.5em 1em').html(text)),
    element = elementClass.clone(true).attr('id', tool);

Answer 2

您可以只使用实际的 HTML：

var element = $('<div id="tool" class="s-Tool"><div style="padding: 0.5em 1em;">' + text + '</div></div>')

要使用不同的 id 执行此操作，您可以将其设为函数：

function makeMyElement(id, text) {
    var element = $('<div id="' + id + '" class="s-Tool"><div style="padding: 0.5em 1em;">' + text + '</div></div>')
    return(element);
}