将对象的属性值追加到容器中

<div id="name">
    <span>dvasd</span>
</div>

<script>
var el=document.getElementById('name');
var per={name1:'zch1',name2:'zch2',age:'26',sex:'mail'};
//将文档碎片节点赋值给一个变量
var fragment=document.createDocumentFragment();
//遍历对象
for(var i in per){
    var strP=document.createElement('p');//创建p元素节点
    var strText=document.createTextNode(per[i]);//创建文本节点
    strP.appendChild(strText);//将文本节点追加到p标签之后
    fragment.appendChild(strP);//将包含内容的p标签追加到文档碎片节点之后，这样就相当于拼接了字符串
}
//只对文档操作一次
el.appendChild(fragment)
</script>