javascript - jQuery: counting visible elements - efficiency/speed problems -


"itemprop =" text ">

I have some code that works fine, but it has become very slow:

HTML:

I have a container with about 50 ul elements in each ul element in h4 heading < Code> li after a series of elements the function hides the title if any line elements are visible

javascript / jQuery: ..

  ceremony show_or_hide_headings () {$ ('# container') children ('ul') .Each (function (i) {var $ this $ (this) =, $ h4 = $ this .children (': first'); if ($ this.children ('Lee: visible') length.) {$ H4.show ();} and {$ h4.hide ();}}); }   

As long as I did not change the nature of elements li it was quite acceptable by the table & gt;; & Lt; Each li now contains a mini table containing the TR & gt; & Lt; TD & gt; Icon & lt; / TD & gt; & Lt; TD & gt; Text & lt; / TD & gt; & Lt; / TR & gt; & Lt; / Table & gt; . Now it takes 2 seconds in the process, while it used to work in less than half the second. (The table below is to prevent wrapping the text under the icon.)

I agree that I can not understand why it should add additional elements in each li

I have also tried:

    . $ ('# Container') appears ('h4') each (function (i) {var $ this $ (this) =, if ($ this.siblings ('li: view'.)) {The $. .show ();} and {$ this.hide ();}});   

and $ ('# container'). Children () Children ('h4') Good solution.

What is remarkable, it is also that when many li elements appear, it is very slow when some are visible, although there are no other lines yet, though , When it works fast enough (i.e., before each table on table)

Any advice was highly appreciated, but please do not request me to post more code from me :)

Thank you.

I think an element is visible or not quite expensive. Consider adding or removing a class to hide or show elements, then you can select them directly based on those classes, which are mostly hosted by getElementsByClassName or querySelectorAll will be supported by the method.

Comments