相关疑难解决方法(0)

例如,第一段代码是否会执行两次完整搜索,或者如果没有发生DOM更改,它是否足够智能以缓存结果？

if ($("#navbar .heading").text() > "") {
  $("#navbar .heading").hide();
}

和

var $heading = $("#navbar .heading");

if ($heading.text() > "") {
  $heading.hide();
}

如果选择器更复杂,我可以想象它是一个非平凡的命中.

当我需要在函数范围内多次访问jQuery选择器的结果时,建议我运行一次选择器并将其分配给局部变量吗？

请原谅我这里的陈词滥调,但我认为这说明了这个问题.那么,这段代码的执行速度会更快:

var execute = function(){
    var element = $('.myElement');
    element.css('color','green');
    element.attr('title','My Element');
    element.click(function(){
        console.log('clicked');
    });
}

比这个代码:

var execute = function(){
    $('.myElement').css('color','green');
    $('.myElement').attr('title','My Element');
    $('.myElement').click(function(){
        console.log('clicked');
    });
}

如果没有区别,有人可以解释原因吗？jQuery是否在选择后缓存元素,以便后续选择器不必再费心搜索dom？

那么我们为什么要缓存jQuery对象呢？

在以下场景中:

var foo = $('#bar');
foo.attr('style','cool');
foo.attr('width','123');

$('#bar').attr('style','cool'); $('#bar').attr('width','123');

为什么第一个选项比第二个选项好得多？

如果是因为性能,它如何减少使用？

如果我在元素周围或多次构造一个jQuery对象,是否存在显着差异？例如:

var jEl = $(el);
$.each(myArray, function() {
    jEl.addClass(this);
}

与:

$.each(myArray, function() {
    $(el).addClass(this);
}

我知道还有其他方法可以解决这个问题,但我的问题是我是否应该只做一次$(el),或者它是否真的无关紧要.这个例子是人为的.

奖励点用于解释$(el)在幕后的作用.

我知道理论上正在做更多的工作,我不知道的是它是否重要......如果jQuery缓存它或浏览器都非常擅长第二个请求或其他什么,而不是它的价值.

仅供参考:相关的jQuery API链接在这里(我提供的是因为$()对Google来说不是最简单的事情):http://api.jquery.com/jQuery/#using-dom-elements

另外值得包括这个有用的链接:http://www.artzstudio.com/2009/04/jquery-performance-rules/,他的几个要点围绕着保存,链接和选择.