JavaScript动态加载

前言

在做项目的过程中需要用到动态加载，如何做，刚开始很为难。

什么是动态加载呢？

比如说，添加便签时，在往库里插入数据的同时需要显示在界面上，添加数据后刷新页面是可以获得，但是没插入一条数据都要刷新界面的话，不仅麻烦，还很慢。所以就需要用到动态加载。

经过不懈努力，其实，也就是动态拼接字符串而已。

正文

再添加数据的时候，如果判断数据库中添加成功，这个时候就要动态加载到界面。

代码：

//若添加成功
                    if (data == "True") {
                        document.getElementById("NewNote").value = "";
                        //document.getElementById("AddSuccess").style.display = "block";
                        document.getElementById("NoNote").style.display = "none";

                        var div = document.createElement("div");
                        div.className = "";

                        var divalert = document.createElement("div");
                        divalert.className = "alert alert-info";

                        var font = document.createElement("font");
                        //编辑和删除按钮
                        var deletebtn = document.createElement("button");
                        deletebtn.className = "btn btn-default btn-sm deletebtn";
                        deletebtn.style = "color:red;float:right; margin-left:5px;width:80px;";
                        deletebtn.textContent = "删除 ";
                        deletebtn.id = id;

                        //编辑和删除字体图标
                        var deletespan = document.createElement("span");
                        deletespan.className = "glyphicon glyphicon-trash";
                        deletespan.disable = true;
                        
                        var textarea = document.createElement("textarea");
                        textarea.className = "form-control update";
                        textarea.style = "resize:none; width:90%;margin-top:0; margin-left:5%; border-style: solid; border-color: #FFFFFF;border-color:#FFFFFF;border-top:0;";
                        //textid为了和按钮区分开，加上指定字符
                        textarea.id = textid;


                        font.append(time);
                        deletebtn.appendChild(deletespan);

                        divalert.appendChild(font);
                        divalert.appendChild(deletebtn);

                        textarea.append(note);

                        div.appendChild(divalert);
                        div.appendChild(textarea);
                        //显示
                        $(".NoteContent").prepend(div);

这样就动态加载到界面了。