1

就像这样：

text = $('#content').find('.text'),
length = 0;
longest = '';

$(text).each(function(){

  if($(this).text().length > length){
    length = $(this).text().length;
    longest = $(this);        
  }       

});

alert($(longest).text());

但是我可以在没有循环的情况下做到这一点吗？我的意思是直接选择最长的文本元素？因为这太慢了

4

4 回答 4

4

如果没有循环，您将无法做到这一点。没有内置的 DOM 函数来查找具有最长文本的元素，因此某些代码必须遍历它们并找到最长的元素。

这是您的代码的清理版本：

var longestSoFar = -1;
var longestItem;

$('#content .text').each(function(){
    var text = $(this).text();
    if (text.length > longestSoFar) {
        longestSoFar = text.length;
        longestItem = this;
    }       
});

alert($(longestItem).text());

我能想到的唯一另一件事是首先比较.text元素的高度并找到比其他元素高的元素，然后仅比较这些元素的文本长度。这可能比计算文本的实际长度要快得多，但它是否有用取决于您的布局以及高度是否是一个准确的过滤器。

为了进一步加快速度，我们可能必须查看您的 HTML 通常是什么样子才能了解减速的来源。 .text()这不是一个特别快的操作，因为它必须遍历给定元素中的所有文本节点并累积它们的所有文本。如果元素中只有一个节点，它很快，但如果节点中有很多涉及的 HTML，那么它有很多节点和子节点要遍历找到所有文本节点。

请注意，在您的代码中，您正在使用已经是 jQuery 对象的东西制作 jQuery 对象。它以这种方式工作，但是当它已经是一个 jQuery 对象时，它是对函数调用的浪费。

于 2013-11-04T02:50:59.153 回答
1

纯脚本版本非常相似：

var longestSoFar = -1;
var longestItem;
var els = document.querySelectorAll('#content .text');

for (var i=0, iLen=els.length, len; i<iLen; i++) {
  len = (els[i].textContent || els[i].innerText).length;
  if ( len > longestSoFar) {
    longestItem = els[i];
    longestSoFar = len;
  }
}

alert(longestItem.textContent || longestItem.innerText);
于 2013-11-04T03:27:55.317 回答
0

小提琴演示

小提琴 DEMO-1

var con = $('#content');
var arr = con.find('.text').map(function () {
    return $(this).text().length;
}).get();
var longest = arr.indexOf(Math.max.apply(Math,arr));
alert($('#content .text:nth-child(' + ++longest + ')').text());
于 2013-11-04T03:15:27.047 回答
0

其他方法用于get()将其保存到Array然后使用自定义排序对数组进行排序，该函数使用长度作为排序方式而不是按字母顺序排序，例如：

var listitems = $(".text").get();
listitems.sort(function(a, b) {
      var compA = $(a).text().length;
      var compB = $(b).text().length;
return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;});

// Get the last element of the array which has the longest length
alert("Longest = "+$(listitems[listitems.length-1]).text());

见JSFiddle

于 2013-11-04T05:09:57.177 回答