js动态向页面添加元素

目标代码：

 <div id="userInfo" class="row cl border-tg">
            <label class="form-label col-xs-3"><span class="c-red">*</span>登录用户名：</label>
            <div id="divLogin" class="formControls col-xs-9">
                <input type="text" id="txtLOGINNAME" name="LOGINNAME" class="input-text" datatype="*" nullmsg="必须填写【登录用户名】！" value="<%=appuser.getLOGINNAME()%>" onkeyup="loginCheck();" />
            </div>
            <div id="divMSG" style="color: #ff070e;display: none" >
                <h6 style="margin: 24px 0 0 0;">/*该登录名已存在！*/</h6>
            </div>
        </div>

JS动态添加元素代码：
 
function createSome() {
        var d=document.getElementById("userInfo");
        var la=document.createElement("label");
        var s=document.createElement("span");
        var dtext=document.createElement("div");
        var itext=document.createElement("input");
        var dmsg=document.createElement("div");
        var hmsg=document.createElement("h6");
        la.setAttribute("class","form-label col-xs-3");
        s.setAttribute("class","c-red");
        s.append("*");
        la.appendChild(s);
        la.append("登录用户名");
        dtext.setAttribute("id","divLogin");
        dtext.setAttribute("class","formControls col-xs-9");
        itext.setAttribute("type","text");
        itext.setAttribute("id","txtLOGINNAME");
        itext.setAttribute("name","LOGINNAME");
        itext.setAttribute("class","input-text");
        itext.setAttribute("datatype","*");
        itext.setAttribute("nullmsg","必须填写【登录用户名】！");
        itext.setAttribute("value","<%=appuser.getQYID()%>"+"${data.PERSONNELNO}");
        itext.setAttribute("onkeyup","loginCheck();");
        dmsg.setAttribute("id","divMSG");
        dmsg.setAttribute("style","color: #ff070e;display: none");
        hmsg.setAttribute("style","margin: 24px 0 0 0;");
        hmsg.append("/*该登录名已存在！*/");
        dtext.appendChild(itext);
        dmsg.appendChild(hmsg);
        d.appendChild(la);
        d.appendChild(dtext);
        d.appendChild(dmsg);
    }
//判断用户名是否已经存在
    function loginCheck() {
        ajaxPost("${ctx}/tuser/loginCheck", { loginname: $("#txtLOGINNAME").val() }, function (d) {
            if (d!=0) {
                document.getElementById("txtLOGINNAME").style='background-color: #fbe2e2';
                document.getElementById("divLogin").className='formControls col-xs-6';
                document.getElementById("divMSG").style.display='inline';
            }else {
                document.getElementById("txtLOGINNAME").style='';
                document.getElementById("divMSG").style.display='none';
                document.getElementById("divLogin").className='formControls col-xs-9';
            }
        });
    }

　　添加元素时，要先设置子元素相关内容，然后再appendChild()添加子元素，否则会报元素为空错误。另外，解决问题时，不应该被某一种思维方式固定，要学会打破模式化，以实现目的为前提（更高级一点的方法就是不去想做什么，最后做成什么算什么，当然这是后话了，现在作为菜鸟要先以实现目的为前提，少想多做，多码）