1
votes

Obtenir du texte à partir d'étendues avec la même classe

J'ai 5 travées, peut-être plus, tous partagent la classe .price .

En lisant la documentation de Jquery, je trouve que la meilleure approche est d'utiliser map code> fonction. Comme ceci:

<span class="price price_50">50</span>
<span class="price price_100">90</span>
<span class="price price_200">120</span>
<span class="price price_300">140</span>
<span class="price price_500">150</span>

J'ai besoin d'une liste de prix, donc après je peux faire quelque chose comme (remarque la partie moins 20):

$('.price').text(function (index) {
                            return "S/ " + prices[index]-20;
                        });

Mais lorsque j'alerte prix , j'obtiens une fenêtre vide.

html :

var prices = $(".price")
             .map(function () {
               return this.text;
             }).get().join();

jquery

3 commentaires

tout est vide

soit vous le lisez avant que les éléments n'existent, soit avant qu'ils aient du texte ..... pour l'instant ils n'ont pas de texte dans l'exemple ... dom n'a pas non plus de .text

Essayez-vous d'obtenir le numéro de la classe price_ ?

3 Réponses :

1
votes

À l'intérieur de la carte ceci fait référence au DOM et il n'a pas de propriété text . Alors convertissez-le en objet jQuery et obtenez le contenu texte en utilisant la méthode text () ou obtenez la propriété textContent à partir de l'objet DOM.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<span class="price price_50">1</span>
<span class="price price_100">2</span>
<span class="price price_200">3</span>
<span class="price price_300">4</span>
<span class="price price_500">5</span>

var prices = $(".price")
  .map(function() {
    return $(this).text();
  }).get().join();

console.log(prices)

0 commentaires

0
votes

Vous avez besoin de contenu dans chacune de vos zones.

<span class="price price_50">50</span>
<span class="price price_100">100</span>
<span class="price price_200">200</span>
<span class="price price_300">300</span>
<span class="price price_500">500</span>
<p id="list_price"></p>

 $( "p" )
  .append( $( ".price" ).map(function() {
       return $( this ).text();
        })
 .get()
 .join( ", " ) );

0 commentaires

1
votes

Le javascript vanille utilise innerText , qui est ce que text () dans les références jQuery.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<span class="price price_50">1</span>
<span class="price price_100">2</span>
<span class="price price_200">3</span>
<span class="price price_300">4</span>
<span class="price price_500">5</span>

var prices = $(".price")
  .map(function() {
    return this.innerText;
  }).get().join();

console.log(prices)

0 commentaires