原生JS修改html内容不影响绑定的点击事件 请认准insertAdjacentHTML、insertAdjacentText方法

insertAdjacentText方法与 insertAdjacentHTML方法类似，只不过是插入纯文本，参数相同

参数说明：

elementDOM.insertAdjacentHTML(where,html)

elementDOM：用于参照插入位置的html元素对象

where：插入位置。包括"beforeBegin"、"beforeEnd”、“afterBegin”、”afterEnd"：

• beforeBegin 插入到标签开始之前
• afterBegin 插入到标签开始之后
• beforeEnd 插入到标签结束之前
• afterEnd 插入到标签结束之后

html：要插入的html代码 或 Text内容

div.insertAdjacentHTML("beforeEnd", html);//插入到标签结束标记前（常用1：在DOM内部最末端插入html）
div.insertAdjacentHTML("afterBegin", html);//插入到标签开始标记之后（常用2：在DOM内部最前面插入html）
div.insertAdjacentHTML("beforeBegin", html);//插入到标签开始前
div.insertAdjacentHTML("afterEnd", html);//插入到标签结束标记后

上面的代码插入位置入下图所示