js创建元素
js创建多条数据,插入到页面中的方法。
方法一:
执行时间大概在35ms左右。
这个就属于使用字符串拼接之后,再一次性的插入到页面中。缺点是,容易导致事件难以绑定。
方法二:
执行时间不定,最少的在80ms左右,做多的达到了180ms左右。
这个方法是创建文档碎片保存需要插入的节点,然后一次性插入到页面中。
方法三:
执行时间基本维持在80ms左右。
这个方法就是每次创建节点之后,就立即插入到页面中,会频繁导致页面的reflow和repaint。不建议使用该方法进行DOM读写。
使用jquery创建文档碎片的时候,方法类似于js创建,需要将jquery对象转为DOM对象,再进行操做。
居然需要300多毫秒。
js创建元素的更多相关文章
- JS 创建元素的三种方法
1.动态创建元素一 document.write() 例如向页面中输出一个 li 标签 <pre class="html" name="code"> ...
- js和jQuery创建元素和把元素插入到文档中所用的方法
js创建元素: document.createElement(" 创建的元素"); //“创建的元素”指:p ,h1,div,span........ js插入元素: docu ...
- js学习-DOM之动态创建元素的三种方式、插入元素、onkeydown与onkeyup两个事件整理
动态创建元素的三种方式: 第一种: Document.write(); <body> <input type="button" id="btn" ...
- js,javascript,删除元素,创建元素,插入子元素
删除元素示例代码 <html> <head> </head> <body> <div> <div id="delId&quo ...
- js创建与追加元素
用javascript创建元素 : var NewNode = document.creatElement('div'); 结合appendChild与insertBefore插入到DOM树中 ins ...
- JS动态创建元素
动态添加标签,可从服务器获取标签文本,然后加载到指定div中,可用于权限控制. 1.添加标签字符串方式 var str='<div>5555555555555555555555555555 ...
- JS动态创建元素(两种方法)
前言 创建元素有两种方法 1)将需要创建的元素,以字符串的形式拼接:找到父级元素,直接对父级元素的innnerHTML进行赋值. 2)使用Document.Element对象自带的一些函数,来实现动态 ...
- js中改变文档的层次结构(创建元素节点,添加结点,插入子节点,取代子节点,删除子节点)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- 原生JS和jQuery创建元素的方法
jQ创建元素的方法 1.原生代码 .creatElement('tr')` .innerHTML = '<h1>加油</h1>' document.write('<h1& ...
随机推荐
- 状态压缩 + 暴力 HDOJ 4770 Lights Against Dudely
题目传送门 题意:有n*m的房间,'.'表示可以被点亮,'#'表示不能被点亮,每点亮一个房间会使旁边的房间也点亮,有意盏特别的灯可以选择周围不同方向的房间点亮.问最少需要多少灯使得所有房间点亮 分析: ...
- ZOJ 3805 (树形DP)
题目链接: http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=5337 题目大意:方块连接,呈树形.每个方块有两种接法,一种接在父块 ...
- MySQL安装问题:Unable to update security settings解决方案
主要问题还是之前装过,卸载的时候卸载不干净导致的. 如下: 安装到最后出现: Unable to update security settings. Access denied for user 'r ...
- Odoo ir actions 分析
源代码位置:openerp/addons/base/ir/ir_actions.py 根类型:ir.actions.actions class actions(osv.osv): _name = 'i ...
- IIS权限设置
Check in the IIS Manager to see what authentication type is enabled on the directories that are part ...
- CSV to XLSX (专用)
$csvFile = "F:\ACL\HZ ACL\ACL-APAC.CSV" $path = "F:\ACL\HZ ACL\ACL-APAC.XLSX" $r ...
- Jenkins学习记录
参考资料 官方文档 用MSBuild和Jenkins搭建持续集成环境(1) 用MSBuild和Jenkins搭建持续集成环境(2) 构建基于Jenkins + Github的持续集成环境 Jenkin ...
- SVN svnserve.conf: Option expected 的解决方法 以及 Authorization failed 的解决方法
① 在 CentOS 6.5 上安装配置了 SVN,在本地 Checkout 的时候报错: 显示:/www/svnroot/webfile/conf/svnserve.conf:12: Option ...
- Nginx平滑重启
kill -HUP cat /usr/local/nginx/logs/nginx.pid`
- wordpress插入腾讯视频的方法
wordpress插入腾讯视频的方法 最近网站需要插入腾讯视频,但是腾讯视频目前没有分享代码,只有分享到微信,qq,微博等具体选项.百度这个问题,貌似没有很好地解决办法,好像有两个插件可以使用,安装试 ...