Question

就是这样：

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

$(text).each(function(){

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

});

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

但是我可以在没有循环的情况下完成吗？我的意思是不知何故直接选择最长的文本元素？因为这太慢了

Answer 1

如果没有循环，你就无法做到。没有内置的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对象时，它会浪费函数调用。

Answer 2

普通脚本版本非常相似：

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

Answer 3

fiddle DEMO

fiddle 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());

Answer 4

其他方式使用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

找到文本最多的元素

4 个答案: