0

以下脚本可以很好地截断链接并添加图标类，但是太慢了： 使用document.ready 阻止代码执行直到加载页面上的所有元素。

我删除了它，它可以工作，但它不适用于最后一个元素

<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>

所以我摆脱了上面的 .ready 并再次添加了这个：

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

-注意 :last -当然可以 - 但它是多余的，我想知道是否有一种更有效的方法可以使此代码立即运行（当页面加载每个元素时）并且完全 而不是运行两个相同的脚本跑得快，一个应用到它错过的最后一个项目。

4

1 回答 1

1

公共代码可以放在一个函数中，并从您使用它的两个地方调用，因此只有一个代码副本，但可以从多个地方调用。

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

和

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

至于加速jQuery(".resultAction:last")，有一些选择：

  1. 给最后一个 id 并直接使用 id 获取它。
  2. 与其在 domReady 上运行它，不如从<body>. 这将比 domReady 执行得快一点并且同样安全。
  3. jQuery(".resultAction")只进行一次查询并保存该结果。然后，您可以随时使用整个列表或最后一个列表，而无需任何进一步的 DOM 查找。
  4. 如果速度真的是个问题，jQuery 通常不是最快的处理方式（尽管速度差异通常不会被注意到）。例如，document.getElementById("item")比 . 快 10 倍以上jQuery("#item")。

此外，这段代码可能有问题：

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

整个文档中应该只有一个#indicatorid，因此您不需要将其限制在this上下文中。因此，您可以只使用$("#indicator")这样的一个对象，或者您需要使用类而不是 id，因为页面中有多个这样的对象。

于 2012-09-12T18:40:56.100 回答