jquery优化
选择器优化执行的速度
- 选择器 优先:id>元素>类
- 使用对象缓存:即使用变量来保存对象名,var $myDiv = $("#myDiv");$myDiv.show();
- DOM元素查找可给上下文范围;$(exp,[context]);exp--被查询元素,context--范围
- var $obj = $("#myDiv");$obj.$(".div000",".myClass");在myClass这个类元素下查找div000元素;
- 多层查询,使用子查询方式查找,如查询p元素
<div id="box">
<span></span>
<div id="content">
<p></p>
</div>
</div>$parent = $("div #content");$child = $parent.find("p");
处理选择器中不规范元素标志;防止有些选择器命名含有特殊字符
在特殊字符前加入转义符\\;例如:查询"div#2#"的元素;$("div\\#2\\#").html();
data()方法缓存数据;
针对元素定义数据,在元素中存取数据,避免数据被循环引用而出现不必要的风险
循环操作DOM的优化:
- 一次性对DOM操作,而不是每次循环都操作DOM
- 例如:动态新增<li>
$(function(){
var arrList = ["list0","list1","list2"];
var strList = "";
$.each(arrList,function(index){
strList = "<li>" + arrList[index] + "</li>"
});
$("ul").append(strList);
}) //而不是 $.each(arrList,function(index){
$("ul").append( "<li>" + arrList[index] + "</li>");
});
jquery库和其他库冲突,$指向问题;
- jQuery.noConflict();转移$的使用权;转移后jquery使用本身jquery对象访问
data()方法缓存数据,针对于元素定义数据
- data([name]);存储数据名称
- data(name,value);
- data(name,{name1:value1,name2:value2});
- removeData(name);
jquery优化的更多相关文章
- 新手必看的jQuery优化笔记十则
jQuery优化 1.简介 jQuery正在成为Web开发人员首选的JavaScript库,作为Web开发者,除了要了解语言和框架的应用技巧外,如何提升语言本身的性能也是开发人员应该思考的问题.文章就 ...
- jquery优化引发的思考
无意间看到jquery优化的一个细节让我觉得不可思议记录一下.仅仅只是换个地方代码就能提高数倍的效率,带给我的不是个仅是个小技巧,而是一总编程思想,技术大牛往往是在细节上体现. 通过缓存最小化选择操作 ...
- jquery优化28个建议
我一直在寻找有关jQuery性能优化方面的小窍门,能让我那臃肿的动态网页应用变得轻便些.找了很多文章后,我决定将最好最常用的一些优化性能的建议列出来.我也做了一个jQuery性能优化的简明样式表,你可 ...
- jquery优化轮播图2
继续优化 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...
- jQuery优化性能的十种方法
1,总是从ID选择器开始继承 例如: <div id="content"> <form method="post" action=" ...
- jquery优化02
缓存变量:DOM遍历是昂贵的,所以尽量将会重用的元素缓存. $element = $('#element'); h = $element.height(); //缓存 $element.css('he ...
- ☀【jQuery 优化】jQuery基础教程(第3版)
jQuery代码优化:选择符篇 √ http://www.ituring.com.cn/article/377 jQuery代码优化:遍历篇 √ http://www.ituring.com.cn/a ...
- jquery优化01
查找: children: find(selector), children(selector): parent: parent(), parents(selector), clo ...
- 15 款优化表单的 jQuery 插件
网页上的表单提供给用户的一种交互的方式,用户输入数据,提交到服务器,等待后续的处理.这些表单在我们浏览的网页中随处可见,也容易被我们忽略. 比如,“联系我们”页面会提供一个表单给用户填写他们的信息和想 ...
随机推荐
- 05_ActiveMQ的selectors
[ JMS Selectors ] JMS Selectors用于在订阅中,基于消息属性对消息进行过滤. 以下是个Selectors的例子:Java代码 consumer = session.crea ...
- 第三方库 jsoncpp 读写json
一.摘要 JSON 的全称为:JavaScript Object Notation,顾名思义,JSON 是用于标记 Javascript 对象的,JSON 官方的解释为:JSON 是一种轻量级的数据传 ...
- java线程方法join的总结
虽然关于讨论线程join方法的博客已经很多了,不过个人感觉挺多都讨论得不够全面,所以我觉得有必要对其进行一个全面的总结. 一.作用 Thread类中的join方法的主要作用就是同步,它可以使得线程之间 ...
- Mysql 性能调优参数
1.DEFAULT_STORAGE_ENGINE <br\>如果你已经在用MySQL 5.6或者5.7,并且你的数据表都是InnoDB,那么表示你已经设置好了.如果没有,确保把你的表转换为 ...
- html tags and attribute集参考
cite 表示引用到某一本书籍名称,默认样式为斜体,q 表示直接引用到里面的话,大块的引用使用block默认样式将增加“双引号” ,关键的词用<b>默认为粗体:一些技术术语则用<i& ...
- angularJS web应用SEO
javascript给网站带来丰富的用户体验,越来越多的网站开始应用angularjs/emberjs这类MVC来开发web应用,可以说能够使用native方式来看法的手机app基本都可以使用替代的j ...
- SSH框架里的iHiberBaseDAO类与iHiberDAOImpl写法
一.iHiberBaseDAO类 package basic; import java.util.*; /** * 基于hibernate技术实现的BaseDAO基类 * @author ZHANGY ...
- 【Leetcode】【Easy】Merge Two Sorted Lists .
Merge two sorted linked lists and return it as a new list. The new list should be made by splicing t ...
- shell单引号双引号详解
linux shell中的单引号与双引号的区别(看完就不会有引号的疑问了) " "(双引号)与 ' '(单引号)的区别 你在shell prompt(shell 提示)后面敲 ...
- Python初学者第六天 列表操作练习
6day 列表练习: 1.创建一个空列表,命名为names,往里面添加old_drilver,rain,jack,shanshan,peiqi,black_girl: names = [] names ...