1. 使用最新版本的jQuery jQuery的版本更新很快，你应该总是使用最新的版本。因为新版本会改进性能，还有很多新功能。 下面就来看看，不同版本的jQuery性能差异有多大。这里是三条最常见的jQuery选择语句： $(‘.elem) $(‘.elem, context) context.find(‘.elem) 我们用1.4.2、1.4.4、1.6.2三个版本的jQuery测试，看看浏览器在1秒内能够执行多少次。结果如下： 可以看到，1.6.2版本的运行次数，远远超过两个老版本。尤其是第一条语...
最近在做一个性能优化方面的工作，遇到很多细节问题，现在一一把遇到的问题记录下来分享给大家，废话就不多谢，我直接贴代码。 代码如下:<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>for与each性能比较</title> <script src="../Cks/jquery-1.7.1.min.js" type="text/javascript"></script> <script type="text/javascript" language="javascript"> function getSelectLength() { var time1 = new...
jQuery性能优化28条建议 一直在寻找有关jQuery性能优化方面的小窍门，能让我那臃肿的动态网页应用变得轻便些。找了很多文章后，我决定将最好最常用的一些优化性能的建议列出来。我也做了一个jQuery性能优化的简明样式表，你可以打印出来或者设为桌面背景。 一、选择器性能优化建议 1. 总是从#id选择器来继承 这是jQuery选择器的一条黄金法则。jQuery选择一个元素最快的方法就是用ID来选择了。 代码如下:$(#content).hide(); 或者...
问题缘由：负责公司的开发平台研发工作，考虑的知识产权的保护工作，必须要考虑java的加密技术和js脚本的加密技术。在目前java加密很容易破解的情况下，还是先搞定js的加密和压缩，一方面可以提高页面加载性能，另外一方面也希望辛苦研发出来的成果得到一定的保护。 研究过程： 1、先强烈鄙视一下哪些随便转载文章的家伙，给我制造了很大的麻烦！！网上很多帖子都不靠谱。。 2、首先想了解jquery使用什么压缩的， 网上找了半天，说...
在写完第一回之后，看到了朋友们的回复，指出了我代码中的一些问题，确实由于时间仓促没有使用IDE，直接搞上了，又由于本人记忆力不好，所以把大小写都忘记了，还好晚上回家，用VS改了一下，呵呵，真是对不住大家了。 从这一讲开始，我们将直正接触一个JQ类库，学习一下JQ的写法，JQ的一些常用的命令等等，今天主要讲的是JQ里的选择器，这也是JQ的一大特点，这从它的名称jQuery中可以看到，主要功力体现在查询上。 前言：对于写在<...
如果对jQuery这东西只停留在用的层面，而不知其具体实现的话，真的很容易用出问题来。这也是为什么近期我一直不怎么推崇用jQuery，这框架的API设定就有误导人们走上歧途之嫌。 代码如下:$.fn.beautifyTable = function(options) { //定义默认配置项，再用options覆盖 return this.each(function() { var table = $(this), tbody = table.children(tbody), tr = tbody.children(tr), th = tbody.children(th), td = tbody.children...
本文提供即刻提升你的脚本性能的十个步骤。不用担心，这并不是什么高深的技巧。人人皆可运用！这些技巧包括： 使用最新版本 合并、最小化脚本 用for替代each 用ID替代class选择器 给选择器指定前后文 建立缓存 避免DOM操作 避免使用concat()，利用join()处理长字串 返回false值 利用小抄和参考文档 使用最新版本 jQuery一直处于不断的开发和改进过程中。 John 和他的团队不断研究着提升程序性能的新方法。 一点题外话，几个月前他还...
最近，我就对jQuery的选择器使用做了一些个小小的实验，用来说明jQuery的不同选择器在不同的情况下，哪个效率更高，更值得使用。 先在每个测试页面的head中引入google提供的jquery文件和用于测试的小插件firejspt。 代码如下:<!-- 引入FireJSPT的库文件 --> <script type="text/javascript" src="firejspt.js"></script> <!-- 引入google提供的1.44版的jQuery的库文件，其实哪个版本都无所谓了，呵呵 --> <script type="text/java...
原因是我在测试的时候：带入了错误的变量。具体可以查看图片上的 $(parentID > childClass) 我直接比较两个字符换大小了！ 感谢 html5中文网 QQ群中的 “不见丘比特”。 其中第三点提到父元素与子元素的关系中提到了 从父元素选择子元素的用例： 代码如下: $(.child, $parent) $parent.find(.child) $parent.children(.child) $(#parent > .child) $(#parent .child) $(.child, $(#parent)) 在其所给的测试...
新版本中的部分重要改进：attr()、val()和data()方法有了更好的性能；在attr()方法中支持Boolean属性；添加了钩子函数，允许对attr()和val()方法进行扩展；map()方法添加了对对象的支持（将JavaScript对象的属性映射到函数）允许使用相对值（“+=”，“-=”）更新CSS；添加了deferred.always(), deferred.pipe()方法，减少了代码量，提高了代码易读性；同步动画 – 现在所有动画都同步到相同的时间间隔. 使用新的浏览器功能，动画也...
根据我的项目实践情况，主要是几个关键点： 1：支持静态的树，即一次性将全部数据加载到客户端。2：异步树，即一次只加载一级或若干级节点，子节点可以异步加载数据。3：Checkbox树（可能是静态树也可能是异步树），用于选择（如选择组织机构，选择数据字典项）等，最好是能够支持节点级联（这个是难点）4：能够承载大数据量，并性能表现优异5：能够在主流浏览器中运行良好 那我要打造的TreeView就是为了实现这个5个主要指标的。 先...
下面贴上完整的代码，我走了很多弯路，原因就是看了回复中朋友们的代码，现在想起来其实不用那么费事吧。 代码如下:<script src="js/jquery-1.4.2.min.js" type="text/javascript"></script> <script src="js/jquery.mytree.js" type="text/javascript"></script> <link href="second.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> $(function(){ var o = { showcheck: true}; o.data =<%=treeNodes...
在之前的基础上，添加方向键左右支持。 在实际工作中，我们会碰到这样一个情况。在页面中显示着100个数据，同时用户还希望他可以更改其中的数据，普通的方式可能如下， 这种方式会出现一个问题，就是页面显示的时候有点慢，同时如果有滚动条的话，会有些卡。下面给出我的一个解决方法，显示的时候全是td的，没有input标签，如下 当你点击其中一个td时，就会出现下面这样当你点击td的时候，会在td动态加入一个input同时把td的值赋给...
将jquery对象缓存起来在 for循环中，不要每次都要访问数组的length属性，我们应该先将对象缓存进一个变量然后再操作，如下所示： 代码如下:var myLength = myArray.length; for (var i = 0; i < myLength; i++) { // 要做的事 } 在循环外使用append 进行DOM操作是有代价的，如果需要往DOM中添加大量元素，你应该一次批量完成，而不是一次一个。 代码如下:// 别这样 $.each(reallyLongArray, function(count, item) { var newLI ...
例如有一段HTML代码： 1.总是从ID选择器开始继承以下是引用片段：<div id="content"> <form method="post" action="#"> <h2>交通信号灯</h2> <ul id="traffic_light"> <li><input type="radio" class="on" name="light" value="red" /> 红色</li> <li><input type="radio" class="off" name="light" value="yellow" /> 黄色</li> <li><input type="radio" class="off" name="light" value="green" /> 绿色</li> </ul> <inpu...