我使用jQuery无法获取HTML P元素文本

Question

下面是我页面上的html，如果价格存在，我想获取商品价格。

    <ol id="ordered">
      <li class="itemnew">
           <span>#1</span>
           <p class="price">$22.99</p>
      </li>
      <li class="itemnew">
           <span>#2</span>
           <p>no price</p>
      </li>
      <li class="itemnew">
           <span>#3</span>
           <p class="price">$13.19</p>
      </li>
      <li class="itemnew">
           <span>#4</span>
           <p>no price</p>

     </li>
     <li class="itemnew">
         <span>#5</span>
         <p class="price">$22.79</p>
     </li>
    </ol>

我想要以下结果：

1

22.99美元

2

没有价格

3

13.19美元

4

没有价格

5

22.79美元

我的代码在这里，但是不能工作。

    var numli = $('ol#ordered li');

    var rank=[];
    var price=[];

    for(var i=0;i<numli.length;i++){
        rank[i]=$(numli[i])has( "span" ).text();
        if($(numli[i]).has( "<p class="price">" )) {price[i]=$(numli[i]).has( "<p class="price">" ).text();}
    else{price[i]='no price';}

    }

Answer 1

根据评论中的讨论，在不更改HTML结构的情况下进行了更新，可以工作，只需定位<p>标记而不是.price类即可：

function getPrices(){
    var priceString = '';
    Array.from(document.getElementsByClassName('itemnew')).map(function(item, index) {
        priceString += index + '' + item.getElementsByTagName('p')[0].innerHTML;
    });

    return priceString;
};

var prices = getPrices();
console.log(prices);

不能说Jquery代码，但是这个普通的JS可以做到：

1。将所有价格元素设为.price的类别，而不考虑其内容。

<ol id="ordered">
  <li class="itemnew">
       <span>#1</span>
       <p class="price">$22.99</p>
  </li>
  <li class="itemnew">
       <span>#2</span>
       <p class="price">no price</p>
  </li>
  <li class="itemnew">
       <span>#3</span>
       <p class="price">$13.19</p>
  </li>
  <li class="itemnew">
       <span>#4</span>
       <p class="price">no price</p>

 </li>
 <li class="itemnew">
     <span>#5</span>
     <p class="price">$22.79</p>
 </li>
</ol>

2。然后迭代值：

Array.from(document.getElementsByClassName('itemnew')).map(function(item, index) {
    console.log(index);
    console.log(item.getElementsByClassName('price')[0].innerHTML);
});

3。或者，当您发表评论时要求将它们全部显示在一个字符串中：

function getPrices(){
    var priceString = '';
    Array.from(document.getElementsByClassName('itemnew')).map(function(item, index) {
        priceString += index + '' + item.getElementsByClassName('price')[0].innerHTML;
    });

    return priceString;
};

var prices = getPrices();
console.log(prices);

Answer 2

只需一个简单的代码：

var price = $('p');
price.each(function(){
  if($(this).hasClass('price')){
    console.log($(this).html());
  }
});

Answer 3

var item = $('.itemnew');
var ptext = "";
item.each(function(){   
    ptext = $(this).children('span').text();
    if($(this).children('price').length){
        ptext  = ptext + $(this).children('price').text();      
    }
});

console.log(ptext);