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 .

转载于:https://www.cnblogs.com/mengfanrong/p/4801994.html

jQuery 文件碎片相关推荐

MyEclipse10中导入的jquery文件报错（出现红叉叉，提示语法错误）
为了做一个页面特效,导入了一个jquery文件,怎想,myeclipse竟然报错说是语法错误,但是这个js文件我是从官网上下载的,不应该出错才对,百度谷歌之后终于找到了解决办法: 选中报错的js文件, ...
jquery文件上传插件|进度条
jquery文件上传插件|进度条一.Uploadify 官网:http://www.uploadify.com/ 下载地址:http://down.51cto.com/data/577863 详细参 ...
转 mvc项目中,解决引用jquery文件后智能提示失效的办法
mvc项目中,解决用Url.Content方法引用jquery文件后智能提示失效的办法这个标题不知道要怎么写才好, 但是希望文章的内容对大家有帮助. 场景如下: 我们在用开发开发程序的时候,经常会引 ...
MP4大文件虚拟HLS分片技术，避免服务器大量文件碎片
MP4大文件虚拟HLS分片技术,避免点播服务器的文件碎片本文主要介绍了通过虚拟分片技术,把MP4文件,映射为HLS协议中的一个个小的TS分片文件,实现了在不实际切分MP4文件的情况下,通过HLS协议 ...
jQuery 文件上传插件：uploadify、swfupload
jQuery 文件上传插件: uploadify.swfupload
10个强大的Ajax jQuery文件上传程序
上传文件和图片是许多网站的一个常用功能,无论是让注册用户上传一个个人资料图片还是上传文件共享,都离不开上传程序,虽然有很多种实现方法,但要让上传看起来更酷一点,如显示剩余时间,同时上传多个文件,以及使 ...
jQuery对象和DOM对象互转的问题、jQuery文件引入问题、DOM版本的网页开关灯
jQuery对象和DOM对象互转的问题 <!DOCTYPE html> <html lang="en"> <head><meta char ...
Bootstrap3基础下载bootstrap3压缩包和相应的jQuery文件
内容参数 OS Windows 10 x64 browser Firefox 65.0.2 framework Bootstrap 3.3.7 editor ...
php中引入jquery文件_WP模板开发中，怎样给wordpress网站的文章，添加点赞功能？...
我们在网上浏览某些网站的文章时,在文章的结尾处,都会有一个点赞的按钮,如果觉得文章内容非常不错,就可以点击这个"点赞"按钮,给这篇文章进行点赞一下.在wordpress网站的模板主 ...

jQuery 文件碎片

jQuery 文件碎片相关推荐

最新文章

热门文章