提高jquery選擇速度

我有這個代碼，它操縱asp.net treeview html代碼。提高jquery選擇速度

此代碼運行頻繁，所以它的重要性在於儘可能快地運行。

我想了解更多關於jquery選擇器並提高速度的信息。到目前爲止，我能夠自己獲得這些代碼。

我不確定的一些事情是如果你想要第三個子元素，我使用[2]或.eq(2)或:nth-child(2)？另外如果我使用$來選擇來自所選東西的東西，這是必要的，還是已經被選中？

有誰知道任何技巧或提示，我可以做，以提高我的jQuery選擇效率？

謝謝。

function showResultsOnTreeview(treeviewID, filenameDictionary) { 
    var sectionNodes = $("#" + treeviewID + " > table"); 
    var numOfSections = sectionNodes.length; 
    var i, j, sectionName, divContainer, itemNodes, numOfItems, itemName, itemTag, itemPath; 

    for (i = 0; i < numOfSections; i += 1) { 
     sectionName = $(sectionNodes[i]).text(); 
     divContainer = $(sectionNodes[i]).next('div'); 
     divContainer.hide(); 
     itemNodes = $('table', divContainer); 
     numOfItems = itemNodes.length; 
     for (j = 0; j < numOfItems; j += 1) { 
      itemTag = $('td', $(itemNodes[j])).eq(2); 
      itemTag.removeClass('treeViewResult'); 
      itemName = getNameFromItem($(itemNodes[j]).text()); 
      itemPath = filenameDictionary[itemName]; 
      if (itemPath != null) { 
       if (itemPath.indexOf(sectionName + "/" + itemName) != -1) { 
        itemTag.addClass('treeViewResult'); 
        divContainer.show(); 
       } 
      } 
     } 
    } 
}

來源

2013-06-24 omega

http://jsperf.com/ – epascarello

@epascarello：我甚至不知道如何使用它，因爲這是來自Microsoft專用Microsoft SharePoint環境中的asp.net解決方案。 – omega

確保緩存對象儘可能多，如'var sect = $（sectionNodes [i]）;' – mplungjan

你可以做一些優化。第一次是肯定使用.eq()而不是[]。喜歡這裏，你野兔創建一個jQuery對象：後來

var sectionNodes = $("#" + treeviewID + " > table");

不過呢，你這樣做：

sectionName = $(sectionNodes[i]).text(); 
divContainer = $(sectionNodes[i]).next('div');

這裏要創建2個，不必要的，jQuery對象，你可能只是這樣做：

sectionName = sectionNodes.eq(i).text(); 
divContainer = sectionName.next('div');

然後，我do't知道，如果你有不同的方式做到這一點，但如果你能刪除「在一個循環中循環」，這將是巨大的。

之後，而不是使用上下文選擇（$('selector', $element)），使用查找。上下文使用find，所以它會減少函數調用的次數。走這條線，例如：

$('td', $(itemNodes[j])).eq(2)

你正在創建2 jQuery對象時，你可以做同樣不需要額外的對象，並可以使用.find()：

itemTag = itemNodes.eq(j).find('td').eq(2);

基本上，使用.find()而不是背景下，避免創建不需要的jQuery對象。希望這會有所幫助。

來源

2013-06-24 18:33:23

這可以使用：'itemTag = curItem.find（'td：nth-child（3）'）;'或者我應該使用'.eq（2）'？感覺就像我使用'eq'，那麼它會得到所有的對象，然後從中得到第n個對象。但是如果我使用了n-child，那麼我只會得到1個元素。 – omega

這是一個有趣的問題。我做了一個jsperf（http://jsperf.com/nth-child-vs-eq-56），結果發現'eq'更快。我的猜測是''nth-child'使用條件背後的代碼計算子位置（循環jquery對象中的每個元素），而'。eq（）'直接進入索引（無循環）。 –

提高jquery選擇速度

回答

相關問題