主要区别
createElement创建的是元素节点，节点类型为1，createDocumentFragment创建的是文档碎片，节点类型是11
性能优势
程序员可以使用DocumentFragment将一批子元素添加到任何类似node的父节点上，对这批子元素的操作不需要一个真正的根节点。程序员可以不依赖可见的DOM来构造一个DOM结构，而效率高是它真正的优势，试验表明，它比直接操作DOM快70%。
使用DocumentFragement要比直接对DOM节点操作要快的多，而且程序员可以利用新DOM节点来操作DocumentFragement，这样比操作整个页面DOM要更容易。所以，当需要进行大量DOM操作时，尽量使用DocumentFragement，它会让你的应用变的更快！
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="test" ></div>
<script>
var fragEle = document.createDocumentFragment();
for (var i = 0;i < 10 ;i++ )
{
var ele = document.createElement("div");
ele.innerText = "Hello world";
fragEle.appendChild(ele);
}
document.getElementById("test").appendChild(fragEle);
</script>
</body>
</html>