优化选择器

  选择器优化已经不如从前那么重要,因为更多的浏览器实现了document.querySelectorAll()方法,所以选择的重担由jQuery转移到了浏览器。

但是仍然有一些技巧是需要记住的。

ID-Based Selectors

 选择器开始选择符永远都是最好的。

// Fast:
$( "#container div.robotarm" );
 
// Super-fast:
$( "#container" ).find( "div.robotarm" );
第二种方法更快是因为第一部分选择器不需要通过Sizzle选择器引擎,单独的只有ID的选择器由document.getElementById()方法处理。

Specificity

在选择器的右边更加具体,而不是左边。

// Unoptimized:
$( "div.data .gonzalez" );
 
// Optimized:
$( ".data td.gonzalez" );
 
在最右边使用 tag.className,而在左边只是用tag或者.class。

Avoid Excessive Specificity

$( ".data table.attendees td.gonzalez" );
 
// Better: Drop the middle if possible.
$( ".data td.gonzalez" );
 

DOM操作相关

Detach Elements to Work with Them

var table = $( "#myTable" );
var parent = table.parent();
 
table.detach();
 
// ... add lots and lots of rows to table
 
parent.append( table );
 
jQuery提供detach()方法将元素从文档树中脱离。

jQuery编程最佳实践笔记的更多相关文章

  1. Java 网络编程最佳实践(转载)

    http://yihongwei.com/2015/09/remoting-practice/ Java 网络编程最佳实践 Sep 10, 2015 | [Java, Network] 1. 通信层 ...

  2. JS编程最佳实践

    最近花了一周时间把<编写可维护的js> 阅读了一遍, 现将全书提到的JS编程最佳实践总结如下, 已追来者! 1.return 之后不可直接换行, 否则会导致ASI(自动分号插入机制)会在r ...

  3. JQuery高性能最佳实践

    [使用最佳选择器] 使用JQuery时,你可以使用多种选择器,选择同一个元素,各种方法之间的性能是不一样的,有时候差异会特别大. 通常比较常用的选择器有以下几个: ID选择器 $("#id& ...

  4. web前端开发最佳实践笔记

    一.文章开篇 由于最近也比较忙,一方面是忙着公司的事情,另外一方面也是忙着看书和学习,所以没有时间来和大家一起分享知识,现在好了,终于回归博客园的大家庭了,今天我打算来分享一下关于<web前端开 ...

  5. 【大数据和云计算技术社区】分库分表技术演进&最佳实践笔记

    1.需求背景 移动互联网时代,海量的用户每天产生海量的数量,这些海量数据远不是一张表能Hold住的.比如 用户表:支付宝8亿,微信10亿.CITIC对公140万,对私8700万. 订单表:美团每天几千 ...

  6. Mysql索引最佳实践笔记0524

    #mysql5.7 innodb默认存储引擎 一.关于索引二.最佳实践三.避坑实践 一.关于索引 1.索引的作用 -提高查询效率 -数据分组.排序 -避免回表查询 -优化聚集查询 -用于多表join关 ...

  7. C 编程最佳实践(书写风格)

    简介本文是为了满足开发人员的需要而写的.我们总结了一套指南,无论作为开发人员还是顾问,这些指南多年来一直都很好地指导着我们,我们把它们作为建议提供给您,希望对您的工作有所帮助.您也许不赞同其中的某些指 ...

  8. 一些通过SAP ABAP代码审查得出的ABAP编程最佳实践

    1. 这两个IF ELSE分支里检测的条件其实逻辑上来说都是同一类,应该合并到一个IF分支里进行检查: It is an expensive operation to open a file in a ...

  9. PHP核心技术与最佳实践--笔记

    <?php error_reporting(E_ALL); /* php 5.3引入 延迟静态绑定 */ /* php5.4引入trait,用来实现多层继承 trait Hello{} trai ...

随机推荐

  1. Apache Commons Chain

    http://commons.apache.org/proper/commons-chain/ http://commons.apache.org/proper/commons-chain/cookb ...

  2. HTTP性能小测试

    一直说node.js如何如何好,就来测试一下吧~~ 首先接受一个小工具 Apache Bench简称ab 可以用来测试http性能 利用Apache Bench测试Web引擎性能关于此工具的详细介绍参 ...

  3. css学习笔记 7

    background-position属性值为百分比的时候,第一个百分比表示水平方向的距离,第二个表示垂直方向上的距离. text-indent的主要作用是为段落设置首行缩进,只能应用于块级元素.该属 ...

  4. asp.net发邮件功能

    protected void SendMail() { try { string CreaterName = ""; string examiner = ""; ...

  5. 获取checkbox后面的文本内容

    http://alygle.blog.51cto.com/1922399/669040 <head> <meta http-equiv="Content-Type" ...

  6. linux PHP 编译安装参数详解

    linux PHP 编译安装参数详解 ./configure --prefix=/usr/local/php --with-config-file-path=/usr/local/php/etc -- ...

  7. lex中yyrestart()的使用

    使用lex&yacc时,如果文件有错,parse停止. "每次调用yyparse(),语法分析器会忘记上次分析可能拥有的任何状态而重新开始分析.这不像lex产生的词法分析器的yyle ...

  8. IE9以下 placeholder兼容

    //input placeholder兼容!(function ($, doc, win) { $.fn.placeholder = function () { var i = doc.createE ...

  9. python split()函数

    Python split()函数 函数原型: split([char][, num])默认用空格分割,参数char为分割字符,num为分割次数,即分割成(num+1)个字符串 1.按某一个字符分割. ...

  10. 个人纪录(初)----Ueditor文本编辑器的引用

    源码下载地址:http://ueditor.baidu.com/website/ 打开源码参考.html 把ueditor引入自己的web项目下. 在需要引入文本的地方写个div,设置样式等. 并且在 ...