染数据的方法

  1)、字符串拼接,  最常用的方法

      优点:只进行一次dom回流

      缺点:原有dom的事件都会丢失

      原因:就在于innerHTML这个属性,这个属性是返回或设置dom中的内容,以字符串形式返回,拼接完之后是string类型,而一些事件属性是dom元素对象身上的,所以这些那些事件属性就会丢失。

  2)、dom循环

      优点:原有的dom身上的事件不会丢失,不影响其他dom

      缺点:dom回流次数过多,严重影响网页性能

  3)、模板

      模板的本质就是字符串拼接

  4)、文档碎片

      document.createDocumentFragement

      优点:既不影响原有的dom属性,也只回流一次

  上面的四种方法对新增的元素都没有之前的事件,如果保证新增的元素也拥有之前的事件,就用事件委托。

ajax如何渲染数据的更多相关文章

  1. datatables通过ajax调用渲染数据,怎么根据数据给td添加class

    html: <table id="table8" cellpadding="0" cellspacing="0" border=&qu ...

  2. Vue2 异步获取的数据(通过ajax)获取的数据 渲染到dom上

    页面dom结构如下 <ul class="user" id="app"> <li><span>姓名: </span&g ...

  3. python 全栈开发,Day75(Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件)

    昨日内容回顾 基于对象的跨表查询 正向查询:关联属性在A表中,所以A对象找关联B表数据,正向查询 反向查询:关联属性在A表中,所以B对象找A对象,反向查询 一对多: 按字段:xx book ----- ...

  4. Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件

    一.Django与Ajax AJAX准备知识:JSON 什么是 JSON ? JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation) JSON 是轻 ...

  5. Django--多对多表的创建、contentType、ajax、ajax传输json数据格式、ajax传输文件数据、 自定义分页器

    MTV与MVC(了解): MTV模型(Django用的就是MTV): M:模型层(models.py) T:templates C:views MVC模型: M:模型层(models.py) V:视图 ...

  6. Django中数据传输编码格式、ajax发送json数据、ajax发送文件、django序列化组件、ajax结合sweetalert做二次弹窗、批量增加数据

    前后端传输数据的编码格式(contentType) 提交post请求的两种方式: form表单 ajax请求 前后端传输数据的编码格式 urlencoded formdata(form表单里的) ja ...

  7. Thinkphp3.2.3使用Ajax一定注意 数据返回

    Thinkphp3.2.3使用Ajax一定注意 数据返回 $data = 'ok'; $this->ajaxReturn($data); 不能直接 echo $data;

  8. 用ajax获取后台数据,返回json数据,怎么在前台使用?

    用ajax获取后台数据,返回json数据,怎么在前台使用呢?后台 C# code   ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 if (dataType == &qu ...

  9. js页面用定时任务通过AJAX获取后台数据,但是从这个页面跳转到其他页面后,定时任务仍然在定时请求后台

    setInterval(function(){//ajax 请求后台数据},1000);这个是A页面的定时器然后我在A页面通过其他请求跳转到其他页面之后后台发现A页面的定时器的那个请求仍然在执行为什么 ...

随机推荐

  1. html计时发送验证码功能的实现

    function countdown() { var time=60; setTime=setInterval(function(){ if(time<=0){ clearInterval(se ...

  2. CF #552(div3)F 背包问题

    题目链接:http://codeforces.com/contest/1154/problem/F 题意:一个商店有n个物品,每个物品只能买一次,同时有m种优惠,即一次买够x件后,这x件中最便宜的k件 ...

  3. mac 中git操作账号的保存与删除

    保存: 在mac中自动保存git的用户名和密码很简单,只需要在终端命令行中输入下面的命令就是: git config --global credential.helper osxkeychain 然后 ...

  4. vue手把手教你实现走马灯商品左右轮播图

    <template> <div> <div class="back_add"> <div class="threeImg&quo ...

  5. 在Linux服务器非root权限下搭建TensorFlow框架(Anaconda)

    今天终于动手折腾实验室的服务器啦!由于权限原因,只能在自己的路径下安装TensorFlow. 1. 下载安装Anaconda 官网下载地址:https://www.anaconda.com/downl ...

  6. 小程序二层嵌套循环数据:微信小程序开发(交流QQ群:604788754)

    WXML: <view class="martop15"> <view class="titlebox"> .二层嵌套循环 </v ...

  7. echarts 去掉 x轴坐标

    symbol:'none', //这句就是去掉点的 smooth:true,

  8. JS变量的提升详解

    此次说明的是var与function的变量提升 那么先看一段代码 <script type="text/javascript"> console.log(test); ...

  9. 正则表达式,grep,sed,

    答案详见:http://www.cnblogs.com/linhaifeng/p/6596660.html 作业一:整理正则表达式博客 ^ # 行首定位 $ # 行尾定位 . # 匹配除换行符以外的任 ...

  10. Jmeter之https脚本录制

    jmeter录制脚本时,跟http脚本录制主要区别是,https录制需要添加安全证书.   一.jmeter代理服务器及证书配置. 1.打开jmeter,右键测试计划添加线程组,右键工作台--> ...