问题描述

页面上有一个提交按钮，点击事件绑定到一个函数上，在函数内我向页面中添加了div,可是这些加入的元素就在页面上停留了一瞬间，函数运行完之后就消失了，有没有什么办法让添加的元素一直留在页面上呀
感觉主要的问题应该是我把函数绑定在了事件上，事件结束以后，函数内的操作也没有了，所以添加的那些元素就消失了，但是业务逻辑确实得这样，不知道怎么解决了
求大神帮忙，呜呜呜，本前端小菜鸡为了做毕设才刚刚入门

html代码（部分）

<div class="form-line">
    <button class="btn">
        <label>提交</label>
    </button>
</div>

<form class="msg-form" id="result">
    <div class="subTitle">预测结果输出</div>
    <div class="result_line">
        <div  class="cell_item left-item">犯罪类型</div>
        <div class="cell_item right-item">犯罪概率</div>
    </div>
</form>

js代码（部分）

btn = document.getElementsByClassName("btn")[0];

btn.onclick = function (){
    //省略部分代码
    var type_name = record[0].substring(1,record[0].length-1);
    var prob = record[1];
    var block = document.createElement("div"); //创建div
    block.className = "result_line";
    var left_block = document.createElement("div"); //创建子div
    left_block.className = "cell_item left-item";
    left_block.textContent = type_name;
    block.appendChild(left_block);
    var right_block = document.createElement("div"); //创建子div
    right_block.className = "cell_item right-item";
    right_block.textContent = prob;
    block.appendChild(right_block);
    var msg_form = document.getElementById("result");
    msg_form.appendChild(block); //加入父元素中
}

向页面中添加了div你是怎么增加的？一般来说增加了div会一直存在在页面上的，不会事件结束以后，新增的div也咩有了。