jquery：获取包含最多字符的H2的宽度/最长

Question

我试图选择包含最多字符的H2，或者宽度最宽的那一个，无论哪一个更简单，或者如果您知道如何要做到这一点你可以把两个？我不确定语法。

Answer 1

要获得像素宽，你可以只循环，虽然那种滥用.width()功能，例如：

var cw = 0, widest; 
$("h2").width(function(i, w) { if(w > cw) {widest = this; cw = w;} return w; }); 
//widest == widest h2 element 
//$(widest).addClass("widest"); 

You can test it out here。在这个函数w里面是当前宽度，所以我们只是看到它是否比我们当前最宽的宽度宽，如果是这样，将当前宽度设置为新的宽度，并将当前宽度设置为当前宽度<h2>， 。

可以使用.text()做字符数类似的东西：

var cw = 0, widest; 
$("h2").text(function(i, t) { if(t.length > cw) {widest = this; cw = t.length;} return t; }); 
$(widest).addClass("widest");​ 

You can test that version here。

Answer 2

他们都很相似，你必须遍历每一个，并检查每个长度或宽度。像

var maxWidth = 0; 

function getLongest(){ 
    var elementWidth, 
    domNode; 

    $("h2").each(function(i, element){ 
    elementWidth = $(element).width(); 
    if (elementWidth > maxWidth){ 
     domNode = element; 
     maxWidth = elementWidth; 
    } 
    } 
    return domNode; 
} 

东西可以替代$(element).width()为$(element).text().length和重命名适当瓦尔。

请注意，如果2个元素具有完全相同的宽度，则只会选择第一个元素。

Answer 3

$(document).ready(function() { 
    var longestH2 = null; 
    $("h2").each(function(k, v) { 
     if ($(v).width() > $(longestH2).width() || longestH2 == null) longestH2 = v; 
    }); 
    $(longestH2).css("border", "3px solid red"); 
});