2011-01-07 21 views
5
<ul> 
    <li class="item-i">AI</li> 
    <li class="item-ii">AII 
    <ul class="level-2"> 
     <li class="item-a">A</li> 
     <li class="item-b">B</li> 
     <li class="item-c">C</li> 
    </ul> 
    </li> 
    <li class="item-iii">III</li> 
</ul> 

Değerleri nasıl alabilirim AI AII A B C III?Li metnin değerleri alma (iç içe geçmiş öğelerde metin olmadan)

$(document).ready(function() { 
    $('li').each(function(index) { 
    alert($(this).text()); 
    }); 
}); 

Ama beni sonuçlarını gerekli verdi değildir: Şimdiye kadar çalıştığım şey

takip ediyor. "Item-ii" ye ulaştığında tüm sonucu verdi.

Öğe tek tek istiyorum.

cevap

2
$(function(){ 
    var text = $('li').map(function(){ 
    return $(this).contents().map(function(){ 
     return this.nodeType==3 ? this.nodeValue : ""; 
    }).get().join(''); 
    }).get().join(' '); 
    console.log(text); 
    // AI AII 
    // 
    //  A B C III 
}); 

contents() yöntemi, hem metin düğümlerini hem de çocuk düğümlerini verir. Metin düğümlerinde nodeType, 3 bulunur. az "işlevsel" tarzı kod için bu deneyin: nedeniyle biçimlendirme hala boş metin düğümü olduğunu

$(function(){ 
    $('li').each(function(){ 
    $(this).contents().each(function(){ 
     if (this.nodeType==3){ 
     console.log(this.nodeValue.replace(/^\s+|\s+$/g,'')); 
     } 
    }); 
    }); 
    // AI 
    // AII 
    // 
    // A 
    // B 
    // C 
    // III 
}); 

Not.

-2
<form> 
    <ul>  
    <li class="item-i">AI</li> 
    <li class="item-ii">AII</li> 
    <ul class="level-2"> 
     <li class="item-a">A</li> 
     <li class="item-b">B</li> 
     <li class="item-c">C</li> 
     </ul> 
     <li class="item-iii">III</li> 
    </ul> 
</form> 
+0

Sırasıyla uyarıları almaya çalışıyorum AI AII A B C III! – coolguy

+2

Biçimlendirme sorunlarınızdan ayrı olarak, bu yasadışı HTML'dir. Orijinal sorunun HTML'si sözdizimsel olarak geçerlidir; Seninki değil. – Phrogz

1
$(function() { 
    var content = $.map($('ul li').contents(), function(elem, i) { 
    if(elem.nodeType === 3 && $.trim(elem.nodeValue).length) 
     return $.trim(elem.nodeValue); 
    }); 

    alert(content); 
}); 

Ref .: $.map(), $.trim(), .contents()

2

metin() işlev listesi-itme 'öğe-i' içindeki tüm düğümleri seçer. Sadece metin düğümlerini seçmeniz gerektiğinden, bunun yerine şu komutu kullanın:

$(document).ready(function(){ 
      $('li').each(function(index) { 
    alert($(this).contents().filter(function(){ return this.nodeType==3}).text()); 
    }); 
     }); 
+0

Metni güncellemek için aynı kod satırını kullanabilir miyiz? – yashgarg1232

İlgili konular