下面是另一种使用jQuery创建div的技术。

元素克隆

假设您的页面中有一个现有的div，您希望使用jQuery克隆该div（例如，在表单中多次复制输入）。你可以这样做。

$（'#clone_button'）.click（function（）{$（“#clone_wrapper div:first”）.clone（）.append（'克隆'）.appendTo（$（“#clone_wrapper”））；});<script src=“https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js“></script><div id=“clone_wrapper”>＜div＞Div公司</div></div><button id=“clone_button”>克隆我</按钮>

我刚刚为此制作了一个小型jQuery插件。

它遵循您的语法：

var myDiv = $.create("div");

DOM节点ID可以指定为第二个参数：

var secondItem = $.create("div","item2");

严重吗？没有。但是这个语法比$（“＜div＞＜/div＞”）好，而且它的价值非常高。

（答案部分复制自：jQuery document.createElement等效项？）

div = $("<div>").html("Loading......");
$("body").prepend(div);    

$("<div/>").appendTo("div#main");

将在<div id=“main”></div>中追加一个空白div

如果您使用Jquery>1.4，您最好使用Ian的答案。否则，我将使用此方法：

这与celoron的答案非常相似，但我不知道他们为什么使用document.createElement而不是Jquery表示法。

$("body").append(function(){
        return $("<div/>").html("I'm a freshly created div. I also contain some Ps!")
            .attr("id","myDivId")
            .addClass("myDivClass")
            .css("border", "solid")                 
            .append($("<p/>").html("I think, therefore I am."))
            .append($("<p/>").html("The die is cast."))
});

//Some style, for better demonstration if you want to try it out. Don't use this approach for actual design and layout!
$("body").append($("<style/>").html("p{background-color:blue;}div{background-color:yellow;}div>p{color:white;}"));

我还认为，在这种情况下，将append（）与回调函数一起使用更可读，因为您现在马上就可以看到将要向主体添加的内容。但这是一个品味问题，在编写任何代码或文本时总是如此。

通常，在JQuery代码中使用尽可能少的HTML，因为这大部分是意大利面代码。它容易出错，很难维护，因为HTML字符串很容易包含拼写错误。此外，它将标记语言（HTML）与编程语言（Javascript/Jquery）混合在一起，这通常是一个坏主意。

我认为这是添加div的最佳方法：

要将测试div附加到ID为div_ID的div元素，请执行以下操作：

$("#div_id").append("div name along with id will come here, for example, test");

现在将HTML附加到这个添加的测试div中：

$("#test").append("Your HTML");