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