一、

使用jQuery选择器获取结果是一个jQuery对象。然而，jQuery类库会让你感觉你正在使用一个定义了索引和长度的数组。在性能方面，建议使用简单的for或者while循环来处理，而不是$.each(); 这样能使你的代码更快。

console.time('array');
var array = ["Aaa","Bbbb","Cccc"];

$.each(array, function(i){

    //array[i] = i;

    console.log(i+" : "+array[i]);
});
console.timeEnd('array');

使用for代替each方法：

console.time('arr');
var arr = ["aaa","bbb","ccc"];

for(var i=;i<arr.length;i++){

    //arr[i] = i;

    console.log(i+" : "+arr[i]);

}
console.timeEnd('arr');

效果-执行时间：

另外需要注意的是：检查长度也是检查jQuery对象是否存在的方法。下面一段代码通过length属性来检查页面中是否含有id为“content”元素。

 var content = $("content");

     if (content) {   //总是true  都会执行

          //do something

      } 

     if (content.length) { //拥有元素采薇true  才会执行

         //do something

      }

===================================================================================

二、用数组方式来遍历jQuery 对象集合

你或许没有注意到，但是在性能方面，对于jQuery each方法这种优雅实现是有代价的。有一个办法能够更快地遍历一个jQuery对象。就是通过数组来实现，jQuery对象集合就是一个类数组，具有length和value属性。可以通过程序来测试一下性能：

HTML:

<ul id="testList" >

   <li>Item</li>

   <li>Item</li>

   <li>Item</li>

   <li>Item</li>

   <li>Item</li>

   <li>Item</li>

   <li>Item</li>

   <li>Item</li>

   <li>Item</li>

   <!-- add 50 more -->

</ul>

JavaScript：

var arr = $('li'),

    iterations = 100000;

//------------------------------

// Array实现：

console.time('Native Loop');

for (var z = 0; z < iterations; z++) {

    var length = arr.length;

    for (var i = 0; i < length; i++) {

        arr[i];

    }

}

console.timeEnd('Native Loop');

//------------------------------

// each实现：

console.time('jQuery Each');

for (z = 0; z < iterations; z++) {

    arr.each(function(i, val) {

        this;

    });

}

console.timeEnd('jQuery Each');

结果：

可以看到通过数组实现方式遍历，执行效率更高。

========================================================================================

三、适应join来拼接字符串：

创建一个数组，然后循环，最后只用join();把数组转换成字符串，代码如下：

　　<body>

        <div id="content"></div>

        <script src="js/jquery.js"></script>

        <script type="text/javascript">

              var arr = ["aaaaaaa","22222","cccccc"];

             for (var i=0;i<arr.length;i++) {

                 arr[i]="<li>"+i+" : "+arr[i]+"</li>";

             }

             $("#content").html(arr.join(''));

        </script>

    </body>

数组方式使用jQuery对象的更多相关文章

  1. JavaScript 对象、DOM对象、jquery对象的区别、转换详解

    一.JavaScript 对象 JavaScript 提供多个内建对象,比如 String.Date.Array 等等. 对象只是带有属性和方法的特殊数据类型. 访问对象的属性: [javascrip ...

  2. JQuery $ $.extend(),$.fn和$.fn.extend javaScript对象、DOM对象和jQuery对象及转换 工具方法(utility)

    一.为什么jquery前面要写$ Javascript没有package的概念,而作者又希望所有jQuery相关的API都能通过一个全局性的对象来容纳. 名为jQuery的全局变量就是这样一个对象,不 ...

  3. jQuery对象和普通DOM对象的区别

    1.DOM对象DOM实际上是以面向对象方式描述的文档模型.DOM定义了表示和修改文档所需的对象.这些对象的行为和属性以及这些对象之间的关系.根据W3C DOM规范,DOM是HTML与XML的应用编程接 ...

  4. jQuery 对象和 DOM 对象

    jQuery(DOM对象) 或者 $(DOM对象) 此函数的作用是将DOM对象,转换为jQuery的对象 DOM对象其实就是javascript的函数对象,可以用来操作所有HTML元素.比如: a标签 ...

  5. jQuery对象和DOM对象之间的转换

    jQuery对象不能使用DOM对象的任何方法,DOM对象也不能使用jQuery对象的任何方法.在需要使用时需要对其进行转换. jQuery对象前使用"$",这不是必须的,不这么使用 ...

  6. js中的DOM对象 和 jQuery对象 比较

    一,二者的区别 通过 jQuery 获取的元素是一个数组,数组中包含着原生JS中的DOM对象. 总结:jQuery 就是把 DOM 对象重新包装了一下,让其具有了 jQuery 方法. 二,二者的相互 ...

  7. jquery 源码学习（四）构造jQuery对象-工具函数

    jQuery源码分析-03构造jQuery对象-工具函数,需要的朋友可以参考下.   作者:nuysoft/高云 QQ:47214707 EMail:nuysoft@gmail.com 声明:本文为原 ...

  8. js中的DOM对象和jQuery对象的比较

    1. 二者的不同之处: 通过jQuery获取的元素是一个数组, 数组中包含着原生JS中的DOM对象. 例如, 针对下面的一个div结构: <div id="Box">& ...

  9. jQuery对象与dom对象相互转换

    核心提示:jquery选择器得到的jquery对象和标准的 javascript中的document.getElementById()取得的dom对象是两种不同的对象类型,一般情况下,如S('#id' ...

随机推荐

  1. display:table布局总结

    1. table布局方式 2. table布局实际应用 效果: 代码: <!DOCTYPE html> <html lang="en"> <head& ...

  2. HDR 高动态范围图像

    以下来源于百度百科: 高动态范围图像(High-Dynamic Range,简称HDR),相比普通的图像,可以提供更多的动态范围和图像细节,根据不同的曝光时间的LDR(Low-Dynamic Rang ...

  3. php处理ajax

    首先安装wamp,若安装过mysql则终止进程防止冲突,可以访问localhost说明成功.在www目录下新建项目,使用localhost访问. php: <?php //3.获取ajax传过来 ...

  4. pat 团体天梯赛 L2-012. 关于堆的判断

    L2-012. 关于堆的判断 时间限制 400 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 陈越 将一系列给定数字顺序插入一个初始为空的小顶堆H[] ...

  5. 利用$.getJSON() 跨域请求操作

    原文发布时间为:2011-01-14 -- 来源于本人的百度文章 [由搬家工具导入] $.get 没有权限？ $.post 没有权限？ 因为他们都不能跨域，那就用 $.getJSON() 吧 利用$. ...

  6. 使用C#的BitmapData

    原文发布时间为:2009-01-16 -- 来源于本人的百度文章 [由搬家工具导入] 我在前两篇图片处理的文章里几乎都用BitmapData来做图片处理的，那么这个东东究竟是个什么玩意儿呢？ C#好是 ...

  7. 时间戳/Date(1354116249000)/ 转换

    从C#的Datatime格式通过Json传到Js里面,时间会显示成时间戳/Date(1354116249000)/ ,js转化如下 function GetDateFormat(str) { retu ...

  8. [LeetCode] Surrounded Regions 广度搜索

    Given a 2D board containing 'X' and 'O', capture all regions surrounded by 'X'. A region is captured ...

  9. 【Visual Studio】解决错误 fatal error C1010: unexpected end of file while looking for precompiled head（转）

    原文转自 http://blog.csdn.net/liuqiyao_01/article/details/38867145 在编译VS时候,出现fatal error C1010: unexpect ...

  10. LeetCode OJ-- Longest Palindromic Substring **

    https://oj.leetcode.com/problems/longest-palindromic-substring/ 给一个string,求它的最长回文子串. 定义一个二维数组bool is ...