对 jquery 中嵌套的 div 标签进行排序:不是想要的结果

sort nested div tags in jquery: not desired result

我的 XSLT 文件中有这段代码:

<div class="item">
    <a href="kala.html">    
        <img alt="">                                    
            <xsl:attribute name="src">
                <xsl:value-of select="/product/image"/>
            </xsl:attribute>
        </img>

        <div class="colors">
            <span class="color">colors</span>
            <span>        
                <xsl:value-of select="/product/color"/>
            </span>
        </div>

        <div class="ratings">
            <span class="rating">grades</span>
            <span class="grade">
                <xsl:value-of select="/product/rate"/>
            </span>
        </div>

        <h4>
            <xsl:value-of select="/product/title"/>
        </h4>
        <p>
            <xsl:value-of select="/product/price"/>
        </p>
    </a>
</div>              

div#serachResult中有一些div.item,现在我想使用这个post中的函数对这些div.item进行排序:Jquery - sort DIV's by innerHTML of children

function sortUsingNestedText(parent, childSelector, keySelector) {
    var items = parent.children(childSelector).sort(function(a, b) {
        var vA = $(keySelector, a).text();
        var vB = $(keySelector, b).text();
        return (vA < vB) ? -1 : (vA > vB) ? 1 : 0;
    });
    parent.append(items);
}

当我尝试这个时:

sortUsingNestedText($('#searchResult'), "div.item", "span.grade");

没有得到想要的结果,div.item随机排序。谁能帮我?提前致谢。

是的,我通过在 sortUsingNestedText 函数中添加 parseFloat 解决了我的问题:

var vA = parseFloat($(keySelector, a).text());
var vB = parseFloat($(keySelector, b).text());