jquery - 在选择器之后找到一个值

Question

我有以下 html 片段

<ul class="product">
 <li><span>Available:</span>123</li>
 <li><span>Code:</span>12345</li>
</ul>

我想要做的是获得可用的价值，即123

我有：

var a = $(".product li:contains('Available')").text();

但是这家店Available:123。我只需要数值。

有任何想法吗？

谢谢

Answer 1

$(function(){

    var a = $(".product li:contains('Available')").clone();
    a.find('span').remove();
    alert(a.html());    

});

示例：http: //jsfiddle.net/wrFAh/8/

编辑：上述解决方案期望LI元素只有一种类型的 HTML 元素，而不是要检索的数字，即span，如果您将 a 添加div到 li，这将不起作用。

为了解决这个问题，我会将PriceHTML 中的 a包装起来span并访问它以避免此类问题。

所以我的 HTML 看起来像

<ul class="product">
    <li><span>Available:</span><span class="price">123</span></li>
    <li><span>Code:</span><span class="price">123</span></li>
</ul>

脚本将是

$(function(){    
   var a = $(".product li:contains('Available')").find(".price").html();
   alert(a);
});

示例http://jsfiddle.net/wrFAh/12/

Answer 2

或者，您可以遍历所<li>标识的子节点，并使用文本节点的值。

var myLi = $(".product li:contains('Available')")[0];

var a;
for(var i = 0; i < myLi.childNodes.length; i++) {
    if(myLi.childNodes[i].nodeType === 3) {
        a = myLi.childNodes[i].nodeValue;
    }       
}

alert(a);

那是一点 jQuery 来识别<li>你感兴趣的，然后纯 Javascript 来做迭代。

Answer 3

没有办法制作一个可以做你想做的事情的选择器。理想情况下，您将修改您的 HTML 并添加类和围绕该值的另一​​个跨度。如果你不能这样做，那么只要后面总是有一个冒号和一个值，你可以使用这个：

var a = $(".product li:contains('Available')").text().split(":")[1];

Answer 4

您可以添加一个正则表达式来提取数字

 var a = $(".product li:contains('Available')").text();
 var number = a.match(/[0-9]+/)[0];