添加dom节点及优化
创建并添加dom加点如何进行优化?
1、使用文档片(DocumentFragment)
可以理解为"仓库",用来保存将来可能会添加到DOM中的节点;
var fragment = document.createDocumentFragment();
fragment.appendChild(document.createElement('ul'));
for(var i = 0;i < 4;i++){
var li = document.createElement('li');
li.appendChild(document.createTextNode(i));
fragment.appendChild(li);
}
document.body.appendChild(fragment);
2、使用innerhtml
3、jQuery
两种方式的优劣(还是不甚理解。。):http://fins.iteye.com/blog/183373
添加dom节点及优化的更多相关文章
- jquery动态添加DOM节点
1.append()方法:向每个匹配的元素内部添加元素 appendTo()方法:将所有匹配的元素追加的指定的元素中 <html> <head> <meta http-e ...
- javascript 分时函数 分批次添加DOM节点 timeChunk
创建1000个webqq的qq好友列表, 一个好友用一个节点来表示 * timeChunk var timeChunk = function(a, fn, sz, done) { var obj, t ...
- vue,在模块中动态添加dom节点,并监听
在这里,onclick事件没有作用,因为它指向的是window,如果写为this.click页面显示为undefined, 我采用的是通过class绑定事件,但是会有一个问题,那就是当你渲染多个事件时 ...
- console.time 简单分析javascript动态加入Dom节点的性能
Bullshit 本来想每天都更新下博客的,可是近期要考试,还有就是自己还是停留在暗自窃喜中吧(这样的想法要改变). 事实上近期总在想.自己要怎么去管理自己的数据,每天的生活都是对自己的数据的增删查改 ...
- jQuery学习-css、class操作、动画方法的运用、jQ操作Dom节点
css操作(设置单个/多个样式.获取样式) //修改单个属性:括号之中直接是需要修改的样式名,值 css(name,value) //例:$("#one").css("b ...
- JavaScript操作DOM节点
DOM (文档对象模型(Document Object Model)) 文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口.在网 ...
- (转载)html dom节点操作(获取/修改/添加或删除)
DOM 是关于如何获取.修改.添加或删除 HTML 元素的标准,下面为大家介绍下html dom节点操作,感兴趣的朋友可以参考下 HTML DOM 是关于如何获取.修改.添加或删除 HTML 元素 ...
- 将HTML字符转换为DOM节点并动态添加到文档中
将HTML字符转换为DOM节点并动态添加到文档中 将字符串动态转换为DOM节点,在开发中经常遇到,尤其在模板引擎中更是不可或缺的技术. 字符串转换为DOM节点本身并不难,本篇文章主要涉及两个主题: 1 ...
- 为DOM节点添加或者删除class
项目中如果应用了常用的javascript类库,多数情况下,这些已经封装好的类库,都会封装一个类似于addClass和removeClass的方法,以便于我们对DOM节点的class进行操作. 以jQ ...
随机推荐
- 2017 beijing icpc A - Euler theorem
2017-09-22 21:59:43 writer:pprp HazelFan is given two positive integers a,ba,b, and he wants to calc ...
- PAT1075. PAT Judge (25)
其中在排名输出上参照了 http://blog.csdn.net/xyzchenzd/article/details/27074665,原先自己写的很繁琐,而且还有一个测试点不通过. #include ...
- Educational Codeforces Round 54 (Rated for Div. 2) DE
D 给出一个无向图,需要删去一些边,想知道最后能有多少个点到1的距离还是过去那么短 如果求一个最短路,然后从删边的角度看,看起来很难做,但是如果从零开始加边就会有做法,如同prim那样,先加入和1直接 ...
- jsplumb 的初次使用
最近的项目要能创建流程, 流程配置什么的就找了 jsplumb 来做流程的显示配置.经过两天的研究成果已经很明显了 参考了以下一些大神们的博客: jsplumb 中文教程 连线绘图工具库介绍 附简单在 ...
- js执行环境的周边概念
一.熟悉几个名词: 1.执行环境(execution context),也叫执行上下文,每个函数都会有自己的执行环境:当浏览器首次加载脚本时,他将默认进入全局执行环境:如果接下来要调用一个内部函数,则 ...
- [Spring]Spring Mvc实现国际化/多语言
1.添加多语言文件*.properties F64_en_EN.properties详情如下: F60_G00_M100=Please select data. F60_G00_M101=Are yo ...
- 在.net中运用HTMLParser解析网页的原理和方法
本文介绍了.net 版的一个HTMLParser网页解析开源类库(Winista.HTMLParser)的功能特性.工作原理和使用方法.对于使用.net进行Web信息提取的开发人员进行了一次HTMLP ...
- 重新学习MySQL数据库4:Mysql索引实现原理
重新学习Mysql数据库4:Mysql索引实现原理 MySQL索引类型 (https://www.cnblogs.com/luyucheng/p/6289714.html) 一.简介 MySQL目前主 ...
- python 连接操作 各类数据库
转载自MySQL Loners 一,python 操作 MySQL:详情见:这里 #!/bin/env python # -*- encoding: utf-8 -*- #-------------- ...
- log4j打印不同颜色
1.首先在eclipse中安装一个插件: ANSI COLOR 在Eclipse Marketplace 中直接搜索 ANSI COLOR 然后安装 2.在log4j 中加入红色字体部分: < ...