Home/ Questions/Q 8522411
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-11T07:06:35+00:00

The following script works well to both truncate a link and add an icon

  • 0

The following script works well to both truncate a link and add an icon class BUT,
It was too slow: using document.ready to hold the code from executing UNTIL all the elements on a page loaded.

I removed it, AND it works BUT it won’t work on the last element

<script>

         jQuery.noConflict();

         jQuery(".resultAction").each(function(){ 

    var fileName =  jQuery(this).find('a').html()
    var fileExtension = fileName.substring(fileName.lastIndexOf('.') );
    var nameChars= fileName.length;
    var shorter=fileName.substring(0,10)+"...";
           //apply style to relative to file extension
        if(fileExtension=="jpg"||"pdf"||"mov"){
        jQuery(this).find("#indicator").addClass("is" + fileExtension.slice(1) );
        }
           //no file extension hide the icon div "indicator"
        if((fileExtension.indexOf('.') == -1)){
        jQuery(this).find("#indicator").addClass("not");
        }
            //truncate text
        if(nameChars>10){
            jQuery(this).find('a').text(shorter);
        }
         });


    </script>

so I got rid of the .ready above and added this over again:

<script>
jQuery(document).ready(function(){
jQuery.noConflict();
jQuery(".resultAction:last").each(function(){ 
//-SAME CODE ABOVE-....
</script>

-notice the :last -which of course works -but it’s redundant and I was wondering if there is a more efficient way to both make this code run instantly (as the page loads each element) and completely instead of running two identical scripts one to run fast, and one to apply to the last item it missed.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Common code can be put in a function and called from both places you use it, thus only having one copy of the code, but called from multiple places.

    jQuery(".resultAction:last").each(processResult);

    and

    jQuery(".resultAction").each(processResult);

    As for speeding up jQuery(".resultAction:last"), there are some options:

    1. Give the last one an id and fetch it directly using the id.
    2. Instead of running it on domReady, run it from a script tag right at the end of the <body>. This will execute a little sooner than domReady and be just as safe.
    3. Do your query on jQuery(".resultAction") just once and save that result. You can then use the whole list or the last one at any time without any further DOM lookups.
    4. If speed is really an issue, jQuery is often not the fastest way to do things (though the speed differences are usually not noticed). For example, document.getElementById("item") is more than 10x faster than jQuery("#item").

    Also, something is probably wrong with this code:

    jQuery(this).find("#indicator")

    There should only be one #indicator id in your entire document so you should not need to confine it to the this context. So, either you can just use $("#indicator") to get the one object like that or you need to be using a class instead of an id because there are multiple objects like this in the page.

    • 0