2

私のhtmlにはたくさんのspan4クラス要素があります。彼らはこのように見えます：

    <div class="span4">
        <div class="widget">
            <div class="header">blablabla</div>
        </div>
    </div>

そのテキストisideヘッダークラ​​スでspan4を並べ替えたいと思います。

私はそれらを分類するためにこれを行います

$(".span4").sort(sortAlpha)

しかし、ヘッダークラ​​ス内のテキストを選択するにはどうすればよいですか？

私はこれをやっていますが、もっと良い方法があると思います

    function sortAlphaAsc(a,b){  
        var nomeA = $(a.childNodes[1].childNodes[1]).text();
        var nomeB = $(b.childNodes[1].childNodes[1]).text();
        return a.innerHTML.toLowerCase() > b.innerHTML.toLowerCase() ? 1 : -1;  
    };

より良い方法があるはずです

$(a.childNodes[1].childNodes[1]).text()
4

4 に答える 4

3 
var elems = $(".span4");

elems.sort(function(a, b) {
    return $(a).find('.header').text().toUpperCase().localeCompare(
         $(b).find('.header').text().toUpperCase()
    );
});

$(".span4").parent().html(elems);​

フィドル

于 2012-12-14T16:27:59.463 に答える
2

これを試して：

function sortAlphaAsc(a,b){  
    var nomeA = $(a).find('div.header').text();
    var nomeB = $(b).find('div.header').text();
    return nomeA.toLowerCase() > nomeB.toLowerCase();  
};
于 2012-12-14T16:26:49.200 に答える
2

スパンを切り離し、並べ替えて追加することができます。メモリ内の要素を変更し、最後にDOMを1回だけ更新するのが非常に効率的であるため、これも非常に高速です。

var $spans = $(".span4").detach();

var sortedSpans = $spans.sort(function(spanA, spanB) {
    var spanTextA = $("div.header", spanA).text();
    var spanTextB = $("div.header", spanB).text();
    
    return spanTextA > spanTextB;
});

$("body").append(sortedSpans);

明らかに、bodyあなたの代わりにそれを実際のコンテナ要素に追加し直します。

または、スパンが共通のコンテナにある場合は、親をキャッシュに保存var $parent = $spans.parent()し、最後に$を実行しparent.html(sortedSpans)ます。

マークアップ全体はわかりませんが、それで始められるはずです。

デモ-スパンを切り離し、並べ替えて、もう一度追加します

于 2012-12-14T16:38:10.680 に答える
1

あなたはこのようなことを意味しますか？

$('.span4').find('.header').text();

これにより、ヘッダーdiv内のテキストが返されます。

于 2012-12-14T16:28:23.080 に答える