jquery优化

新手必看的jQuery优化笔记十则

jQuery优化 1.简介 jQuery正在成为Web开发人员首选的JavaScript库,作为Web开发者,除了要了解语言和框架的应用技巧外,如何提升语言本身的性能也是开发人员应该思考的问题.文章就以jQuery为例,为大家提供了10个有效提升jQuery性能的小技巧. 2. 合并.最小化脚本大部分浏览器都不能同时处理多个脚本文件,所以它们都是排队加载——加载时间也相应地延长了.考虑到你网站的每个页面都会加载这些脚本,你应该考虑把它们放到单个文件中,然后利用压缩工具(比如Dean Edwa…

jquery优化引发的思考

无意间看到jquery优化的一个细节让我觉得不可思议记录一下.仅仅只是换个地方代码就能提高数倍的效率,带给我的不是个仅是个小技巧,而是一总编程思想,技术大牛往往是在细节上体现. 通过缓存最小化选择操作jQuery的选择器棒极了.它们可以在页面上以极其简单的方法找到任何元素,但是在内部它们必须通过大量的步骤才可以实现选择操作,如果你错误的使用它们,那么你可能发现一切都变得相当慢. 如果你一次又一次的选择相同元素(例如在一个循环中),那么你可以一次选择出它并放入内存中,同时你可以在核心内容里操作它.…

jquery优化28个建议

我一直在寻找有关jQuery性能优化方面的小窍门,能让我那臃肿的动态网页应用变得轻便些.找了很多文章后,我决定将最好最常用的一些优化性能的建议列出来.我也做了一个jQuery性能优化的简明样式表,你可以打印出来或者设为桌面背景. 一.选择器性能优化建议 1. 总是从#id选择器来继承这是jQuery选择器的一条黄金法则.jQuery选择一个元素最快的方法就是用ID来选择了. 1 $('#content').hide(); 或者从ID选择器继承来选择多个元素: 1 $('#con…

jquery优化轮播图2

继续优化 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>轮播图</title> …

选择器优化执行的速度选择器优先:id>元素>类使用对象缓存:即使用变量来保存对象名,var $myDiv = $("#myDiv"):$myDiv.show(); DOM元素查找可给上下文范围:$(exp,[context]):exp--被查询元素,context--范围 var $obj = $("#myDiv"):$obj.$(".div000",".myClass"):在myClass这个类元素下查找d…

jQuery优化性能的十种方法

1,总是从ID选择器开始继承例如: <div id="content"> <form method="post" action="#"> <h2>成绩</h2> <ul id="grades"> <li><input type="radio" class="good" name="grade&quo…

jquery优化02

缓存变量:DOM遍历是昂贵的,所以尽量将会重用的元素缓存. $element = $('#element'); h = $element.height(); //缓存 $element.css('height',h-20); 如果你打算对DOM元素做大量操作(连续设置多个属性或css样式),建议首先分离元素然后在添加. 使用var与匈牙利命名法,且避免全局变量 : 优化选择符:避免多个ID选择符 ajax: 使用相关函数: $("#file").on("click"…

☀【jQuery 优化】jQuery基础教程（第3版）

jQuery代码优化:选择符篇 √ http://www.ituring.com.cn/article/377 jQuery代码优化:遍历篇 √ http://www.ituring.com.cn/article/382…

jquery优化01

查找: children: find(selector), children(selector): parent: parent(), parents(selector), closest(selector) //最近的上层 find() $("#main li");$("#main > li"); ---> $("#main").find("li");$("#mai…

15 款优化表单的 jQuery 插件

网页上的表单提供给用户的一种交互的方式,用户输入数据,提交到服务器,等待后续的处理.这些表单在我们浏览的网页中随处可见,也容易被我们忽略. 比如,“联系我们”页面会提供一个表单给用户填写他们的信息和想提的建议或者问题,但是开发者往往只关注网站的设计和用户交互的内容,并不会注意到用户进行交互的方式——表单. 以下整理的这个列表就是为 Web开发者准备的,包括了 15 款优化表单的 jQuery 插件.希望大家能从中找到适合自己的 jQuery 插件,优化网页表单,更好的与用户进行交互.看完要记得…

jquery性能优化的十种方法

jquery性能优化的十种方法有时候我们在书写jquery的时候,为了书写代码方便,往往忽略了程序执行过程中,给客户端带来的压力.随之而来的就是在某些低端浏览器或者低端电脑上运行速度缓慢,甚至无法运行等问题. 因此我们有必要对我们自己书写的jquery代码进行优化,以达到更快捷.更流畅的运行效果. 在这里整理了十种jquery优化的方法,如下: 1,总是从ID选择器开始继承在jQuery中最快的选择器是ID选择器,因为它直接来自于JavaScript的getElementById()方法.例如…

笔记：IIFE 立即执行的函数表达式 +function ($) { }(window.jQuery);

在Bootstrap源码(具体请看<Bootstrap源码解析1>)和其他jQuery插件经常看到如下的写法: +function ($) { }(window.jQuery); 这种写法称为:IIFE 2(Imdiately InvokedFunction Expression 立即执行的函数表达式). 解析: 先弄清和函数声明(function declaration)的区别: 函数表达式 var test = function() {}; 函数声明 function test…

jquery选择器的实现流程简析及提高性能建议！

当我们洋洋得意的使用jquery强大的选择器功能时有没有在意过jquery的选择性能问题呢,其实要想高效的使用jquery选择器,了解其实现流程是很有必要的,那么这篇文章我就简单的讲讲其实现流程,相信会为读者的jquery优化开发提供一些小的建议. 我们知道jquery的$()函数可以传很多种参数(document.string.fn.array.number),那么jquery的init方法就会根据你传参的类型的不同进入不同的流程.其他的我们今天就不多说了,我们重点讲一下对string类型的处…

Js极客之路 - 优化操作（性能优化）

1．因为每次For循环都会计算一次arr.length,所以有必要存储数组长度以减少计算.针对这篇文章(http://www.crimx.com/2015/04/21/should-array-length-be-cached-or-not/),V8引擎好像已经帮我们做了不变数据的缓存,不过个人认为还是很有必要的,像他说的,假若只有V8引擎做了此事(V8开发者有这样说吗?),我们做缓存,对于V8就当帮它咯,对于其他就是优化咯. //bad var arr=[1,2,3,...]; for(var…

Bootstrap IIFE

在Bootstrap源码(具体请看<Bootstrap源码解析>)和其他jQuery插件经常看到如下的写法: +function ($) { }(window.jQuery); 这种写法称为: IIFE (Imdiately Invoked Function Expression 立即执行的函数表达式). 一步步来分析这段代码. 先弄清函数表达式(function expression)和函数声明(function declaration)的区别: 函数表达式 Function Expre…

[转]Javascript中的自执行函数表达式

[转]Javascript中的自执行函数表达式本文转载自:http://www.ghugo.com/javascript-auto-run-function/ 以下是正文: Posted on 2014年6月11日 by admin | 1 Reply 在写插件或我们日常代码中,经常都会用到自执行函数表达式,最简单,最常用的也就是匿名函数自运行了.如下代码结构: 1 (function(){ 2 //code 3 })() 网上看到一篇关于这方面的文章,讲得蛮详细,特转载到博客记录一下. 转载…

JavaScript的IIFE（即时执行方法）

(1)标准写法 (function (window, document, undefined) { // })(window, document); (2)作用域Scope JavaScript有function作用域,所以function首先创建一个私有的作用域,在执行的时候都会创建一个执行上下文. (function (window, document, undefined) { var name = '张三'; })(window, document); console.log(name)…

IIFE-js中(function(){…})()立即执行函数写法理解

介绍IIFE IIFE的性能使用IIFE的好处 IIFE最佳实践 jQuery优化在Bootstrap源码(具体请看<Bootstrap源码解析>)和其他jQuery插件经常看到如下的写法: +function ($) { }(window.jQuery); 这种写法称为: IIFE (Imdiately Invoked Function Expression 立即执行的函数表达式). 一步步来分析这段代码. 先弄清函数表达式(function expression)和函数声明(func…

Web 前端最佳实践

Web 最佳实践前端选择器尽量使用ID选择器基于Id的选择器:先使用ID选择器定位,然后再使用find方法精确查找 // Fast: $( "#container div.robotarm" ); // Super-fast: $( "#container" ).find( "div.robotarm" ); 指定选择的上下文 // 劣质的代码:因为需要遍历整个DOM来找到.class $('.class'); // 高品…

仿Google首页搜索自动补全

仿Google自动补全,实现细节: 后台是简单的servlet(其实就是负责后台处理数据交互的,没必要非跌用个struts...什么的) 传输介质:xml 使用jQuery js框架功能实现: 如果在缓冲300ms内只输入一个字母,则开始与后台交互. 弹出检索匹配单词的层.可以通过方向键上下选择选项,被选择的高亮显示,颜色和Google的一模一样,并且键盘选择过程中文本框动态赋值高亮单词,回车提交,ESC隐藏显示层,删除文本框中内容. 被鼠标选择的单词高亮显示,点击鼠标可以替换文本框内容,层…

jQuery2.x源码解析(DOM操作篇)

jQuery2.x源码解析(构建篇) jQuery2.x源码解析(设计篇) jQuery2.x源码解析(回调篇) jQuery2.x源码解析(缓存篇) jQuery这个类库最为核心重要的功能就是DOM操作了.DOM是由w3c制定的为HTML和XML文档编写的应用程序接口,全称叫做W3C DOM,它使得开发者能够修改html和xml的内容和展现方式,将网页与脚本或编程语言连接起来. 但是标准在各个浏览器中的实现是不一样的,同时DOM发展也是循序渐进的,不断地增加新的api,因此各个浏览器乃至各个版…

【jquery优化】的更多相关文章