用jQuery创build一个新元素的首选方法
我有两种方法可以使用jQuery创build一个<div> 。
或者：
var div = $("<div></div>"); $("#box").append(div);
要么：
$("#box").append("<div></div>");
使用除可重用性以外的其他方法有什么缺点？
第一个选项给你更多的灵活性：
var $div = $("<div>", {id: "foo", "class": "a"}); $div.click(function(){ /* ... */ }); $("#box").append($div);
当然， .html('*')会覆盖内容，而.append('*')不会，但是我想这不是你的问题。
另一个好的做法是在你的jQueryvariables前添加$ ：
在jQuery中使用$与variables有什么特定的原因
围绕"class"属性名称放置引号将使其与不太灵活的浏览器更兼容。
我个人认为代码的可读性和可编辑性比代码更重要。 无论哪一个你觉得容易看，应该是你select以上因素。 你可以把它写成：
$('#box').append( $('<div/>') .attr("id", "newDiv1") .addClass("newDiv purple bloated") .append("<span/>") .text("hello world") );
和你的第一个方法为：
// create an element with an object literal, defining properties var $e = $("<div>", {id: "newDiv1", name: 'test', class: "aClass"}); $e.click(function(){ /* ... */ }); // add the element to the body $("#box").append($e);
但就可读性而言， jQuery方法是我的最爱 。 按照这个有用的jQuery技巧，笔记和最佳实践
更具performance力的方式，
jQuery('<div/>', { "id": 'foo', "name": 'mainDiv', "class": 'wrapper', "click": function() { jQuery(this).toggleClass("test"); }}).appendTo('selector');
参考： 文档
根据jQuery官方文档
要创buildHTML元素，首选$("<div/>")或$("<div></div>") 。
然后你可以使用appendTo ， append ， before ， after等。 将新元素插入DOM。
PS：jQuery版本1.11.x
我有一个新的想法，使用.html(content)
你可以在你想要的地方放一个空的<div></div> ，不要忘记为这个DIV设置一个ID。
之后，使用$("#divId").html(content)来replace您的新内容（即您要追加的DIV $("#divId").html(content)的空DIV。
如果#box是空的，什么都不是，但是如果不是这些，那么就完全不一样了。 前者将添加一个div作为#box的最后一个子节点。 后者完全用一个空的div ，text和all #box代替#box的内容。
我会推荐第一个选项，你实际上使用jQuery构build元素。 第二种方法简单地将元素的innerHTML属性设置为string，这恰好是HTML，并且更容易出错并且不太灵活。
假设我们有场景来dynamicreplace一些html标签来格式化，我们不能使用$（'＃id'）。text（）; 因为它不会接受html格式的文本 ，为了完成这些工作，我们需要使用jQuery append方法，而不是每次我们需要更新和使用append方法时.text（）方法的替代方法。
var fileImportStatus; $('#id').change(function(){ if($('#id').is(':checked')){ fileImportStatus = "<strong>ON</strong>"; }else { fileImportStatus = "<strong>OFF</strong>"; } }); $('#saveBtn').click(function(){ $('#fileImportStatusTxt').empty(); $('#fileImportStatusTxt').append('File Import is ' + fileImportStatus); });
也可以通过以下方式创build一个div元素：
var my_div = document.createElement('div');
添加类
my_div.classList.add('col-10');
也可以执行append（）和appendChild（）
