jQuery 文件碎片
经JS操作DOM节点可以是节点的单位,让我们连接节点,能够createElement,createTextNode,然后，appendChild定在一起,然后再用appendChild或insertBefor加入到DOM树中.但假设要往DOM树中动态加入大量的节点.就会非常麻烦.并且每次都会刷新DOM。造成性能上的缺陷。
解决方法是使用文档碎片这种方法创建文档碎片。
我个人认为应该把这个翻译成文档片段比較合适。
使用jQuery解决方式。
<span style="font-family:FangSong_GB2312;font-size:18px;"><html>
<head>
<title></title>
</head>
<body>
<ul>
</ul>
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script type="text/javascript">
var arr = ["baidu","sina","telcent","ali"];
var fragment = document.createDocumentFragment();
$.each(arr,function(i,item){
var newItem = $("<li>"+item+"</li>")[0];
fragment.appendChild(newItem);
});
$("ul")[0].appendChild(fragment);
</script>
</body>
</html></span>
也能够使用以下的方法来解决
<span style="font-family:FangSong_GB2312;font-size:18px;"><html>
<head>
<title></title>
</head>
<body>
<ul>
</ul>
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script type="text/javascript">
var arr = ["baidu","sina","telcent","ali"]; var html = "";
$.each(arr, function(index, val) {
html += "<li>" + val + "</li>";
});
$('ul').html(html);
</script>
</body>
</html></span>
效果是同样的。
当然,你也能够建个新的节点,比方说div,先将oP加入到div上,然后再将div加入到body中.但这样要在body中多加入一个<div></div>.但文档碎片不会产生这样的节点.
注意:绑定碎片实际上是把碎片的内容附加到被绑定节点以下.并不会产生类似<fragment></fragement>的节点;
Best Wishes .
版权声明：本文博主原创文章，博客，未经同意不得转载。
jQuery 文件碎片的更多相关文章
- 基于jQuery图像碎片切换效果插件FragmentFly
基于jQuery图像碎片切换效果插件FragmentFly.这是一款只需三步轻松完成碎片动画,参数可调,使用方便. 在线预览 源码下载 部分代码: <div class="all_ ...
- 强大的支持多文件上传的jQuery文件上传插件Uploadify
支持多文件上传的jQuery文件上传插件Uploadify,目前此插件有两种版本即Flash版本和HTML5版本,对于HTML5版本会比较好的支持手机浏览器,避免苹果手机Safari浏览器不支持Fla ...
- jQuery文件上传插件Uploadify（转）
一款基于flash的文件上传,有进度条和支持大文件上传,且可以多文件上传队列. 这款在flash的基础上增加了html5的支持,所以在移动端也可以使用. 由于官方提供的版本是flash免费,html5 ...
- jQuery文件上传插件jQuery Upload File 有上传进度条
jQuery文件上传插件jQuery Upload File 有上传进度条 jQuery文件上传插件jQuery Upload File,插件使用简单,支持单文件和多文件上传,支持文件拖拽上传,有进度 ...
- 赞！带进度条的 jQuery 文件拖放上传插件
jQuery File Uploader 是一个 jQuery 文件拖放上传插件,包括 Ajax 上传和进度条效果.作者编写这个插件的想法是要保持它非常简单,不像其他的插件,很多的标记,并提供一些 H ...
- 带进度条的 jQuery 文件拖放上传插件
jQuery File Uploader :jQuery File Uploader 是一个 jQuery 文件拖放上传插件 兼容性判断 下载:https://github.com/danielm/u ...
- 转 mvc项目中,解决引用jquery文件后智能提示失效的办法
mvc项目中,解决用Url.Content方法引用jquery文件后智能提示失效的办法 这个标题不知道要怎么写才好, 但是希望文章的内容对大家有帮助. 场景如下: 我们在用开发开发程序的时候,经常 ...
- MyEclipse10中导入的jquery文件报错（出现红叉叉，提示语法错误）
为了做一个页面特效,导入了一个jQuery文件,怎想,myeclipse竟然报错说是语法错误,但是这个js文件我是从官网上下载的,不应该出错才对,百度谷歌之后终于找到了解决办法: 选中报错的js文件, ...
- MVC 中引入Jquery文件的几种方法
方法1: <script src="@Url.Content("~/Scripts/jquery-1.9.1.js")" type="text/ ...
随机推荐
- expandableListView的divider该溶液显示在黑色
黑色是divider高度.如何让他成为透明的啊? 布局例如以下: <ExpandableListView android:layout_width="wrap_content&qu ...
- Smart Framework
Smart Framework:轻量级 Java Web 框架 发表于2年前(2013-09-01 08:39) 阅读(48569) | 评论(188) 544人收藏此文章, 我要收藏 赞83 阿 ...
- ServletContext加入和访问
(1)关于ServletContext认识: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveGxnZW4xNTczODc=/font/5a6L5L2T/f ...
- MyEclipse调整项目的顺序
MyEclipse该项目是按照字母顺序排列的项目名称,无法调整. 例,我现在做Photo工程项目,向下位置,非常不方便: 可是,它有一个将项目分组的功能"Working Sets" ...
- HTML5 transform三维立方体（随着旋转的效果）
为了得到更好的把握transform精华.因此,我们决定完成三维立方体模型,可以实现360无死三维旋转作用. 但旋转更难推断每侧视图的序列.然而,完美的解决方案,我希望有人能回答. 源代码直接贡献的朋 ...
- oracle的分页查询碰到的一个小问题
订单表.与订单信息表(多个订单信息列有同一个订单id) 查出全部订单以及其信息并依照订单分页 select * from( select a. * , (DENSE_RANK() OVER(ORDER ...
- Unity带有网络功能——创建服务，并连接到一个特定的服务
游戏本身需要在网络上创建服务,然后其他的游戏能够连接到这个服务,此外真实场景现在玩同样的游戏效果一起. 该方法是创建一个服务呼叫Network.InitializeServer( ): 是Networ ...
- 【MySQL笔记】mysql来源安装/配置步骤和支持中国gbk/gb2312编码配置
不久的学习笔记.分享.我想有很大的帮助谁刚开始学习其他人的 备注:该票据于mysql-5.1.73版本号例如 1. mysql源代码编译/安装步骤 1) 官网下载mysql源代码并解压 2) cd至源 ...
- 使用eclips发展java当闪回的问题
近期開始android的开发学习.当然要先从java入手了.我选择eclips作为开发的IDE,在測试java代码例子时,假设我的代码是能够出现系统自己主动代码补齐时eclips就会立马闪退. 刚開始 ...
- 【二分法】 HDU 2446 Shell Pyramid
意甲冠军:非常多,形成一个金字塔球 文章x层 x*(x+1)/ 2 球 给你个S 金字塔的一层代表第一数字向下S球 它是其中 这层中的第几行 第几列 公式 1 : x*(x+1)*(x+2)/ 6 ...