jQuery.toggle() कई <TR> तत्वों पर बेहद धीमी गति से

Question

मैं इस तरह एक मेज है। अब मैं इस तरह इन पंक्तियों को चालू करना चाहते हैं:

$("#toggle_a").click(function(){ 
     $("tr.a").toggle(); 
    }); 
    $("#toggle_b").click(function(){ 
     $("tr.b").toggle(); 
    }); 

लेकिन यह वास्तव में बेहद धीमी गति से और समय ब्राउज़र कार्य बंद करना चाहता है के सबसे।

क्या किसी को यह विचार है कि इस चीज़ को तेज़ी से और उपयोग करने योग्य कैसे बनाया जाए?

Answer 1

लगता है क्योंकि jQuery वर्ग के नाम से खोज तत्व ..

नोट: वर्ग चयनकर्ता jQuery में धीमी चयनकर्ताओं के बीच में है; आईई में यह पूरे डोम के माध्यम से loops। जब भी संभव हो, से बचें।

यह भी जांच this लेख

Answer 2

यदि आप तालिका डेटा प्रदर्शित नहीं कर रहे तालिकाओं का उपयोग न करें।

जब आपके पास बहुत बड़ी टेबल हैं (प्रतिपादन तालिकाओं में जटिलता के कारण) कुख्यात रूप से धीमे होते हैं। और इस तरह के परिवर्तन के साथ बहुत सारे रिफ्लो हो रहे होंगे।

Answer 3

तालिका संरचना का उपयोग करने के बजाय, LI टैग का उपयोग करें। यह एचटीएमएल रेंडर प्रक्रिया तेज हो जाएगा।

<UL style="padding: 0; list-style-type: none;"> 
    <LI class="a">1</LI> 
    <LI class="b">2</LI> 
    <LI>3</LI> 
    <LI>4</LI> 
</UL> 

अब आप इस पर चयनकर्ता लिख ​​सकते हैं। यह निश्चित रूप से एक सुधार

Answer 4

मैं एक ऐसी ही समस्या थी लेकिन कुछ पंक्तियों से, के बारे में 200

मैं .hide() और .show() और अब इस लगभग तात्कालिक उपयोग किया जाएगा।