Danke im Voraus

Ich frage mich, wie ich viele Werte aus einem Codeblock erhalten kann. Ich weiß nicht, ob ich ein Array oder etwas anderes verwenden muss. Ich bin neu bei js

Betrachten Sie den HTML-Code

 <div class="row">
            
            <div class=" available seat" data="C-08" ></div>
            <label>C-08</label>

            <div class=" available seat" data="D-08"></div>
            <label>D-08</label>

            <div class=" available seat" data="E-08"></div>
            <label >E-08</label>

            
        </div>

Ich muss die Rücksitznummern der einzelnen Sitze wie ...... E08 FO8 ETC erhalten

Was ich getan habe ist

 let selectedSeats=document.querySelectorAll('.row .seat.available'); 
   let seatNumber=[]
   selectedSeats.forEach((sts)=>{
          seatNumbers=[sts.nextElementSibling.innerText];
     });
console.log(seatNumbers);

Ich bekomme nur die letzte Sitznummer im Log

Bitte sagen Sie mir, wie ich alle Sitznummern bekommen kann

-1
kaki55 19 Aug. 2020 im 07:13

4 Antworten

Beste Antwort

Verwenden Sie Array # Push, um zu pushen Text zu Ihrem seatNumber Array [].

Auch anstelle von nextElementSibling würde ich die Verwendung von neuem Datenattribute, die viel feasible und einfach zu verwenden sind.

Durch die Verwendung von Datenattributen wird sichergestellt, dass Sie exakte Daten von div und nicht unerwünschte Leerzeichen oder usw. usw. von label erhalten.

Bearbeiten: Da Sie hervorgehoben haben, dass Sie nur eindeutige Werte pushen und Duplikate vermeiden möchten, können Sie mit IndexOf() überprüfen, ob das Array die vorhandene Sitzplatznummer enthält. Es werden nur die eindeutigen Sitznummern angezeigt.

Live-Demo:

let selectedSeats = document.querySelectorAll('.row .seat.available');
let seatNumber = []
selectedSeats.forEach((sts) => {
  let seats = sts.getAttribute('data') //get seat number
  if (seatNumber.indexOf(seats) === -1) {
    seatNumber.push(seats); //only push unique seats in to the array
  }
});
console.log(seatNumber);
<div class="row">

  <div class="available seat" data="C-08"></div>
  <label>C-08</label>

  <div class="available seat" data="A-02"></div>
  <label>A-02 - duplicate</label>

  <div class="available seat" data="D-08"></div>
  <label>D-08</label>

  <div class="available seat" data="A-02"></div>
  <label>A-02 - </label>

  <div class="available seat" data="E-08"></div>
  <label>E-08</label>

  <div class="available seat" data="E-08"></div>
  <label>E-08 duplicate</label>


</div>
0
Always Helping 19 Aug. 2020 im 05:10

Ihr forLoop wird bei jeder Iteration überschrieben.

Sie sollten versuchen, die push () -Methode wie folgt zu verwenden:

let selectedSeats = document.querySelectorAll(".row .seat.available");
let seatNumber = [];
selectedSeats.forEach((sts) => {
  seatNumber.push(sts.nextElementSibling.innerText);
});
console.log(JSON.stringify(seatNumber));

Das Konsolenprotokoll mit dem analysierten JSON führt dazu:

["C-08","D-08","E-08"]
1
Alisson 19 Aug. 2020 im 04:26

Sie sollten push verwenden, anstatt einem neuen Array zuzuweisen

let selectedSeats = document.querySelectorAll('.row .seat.available');
let seatNumbers = []
selectedSeats.forEach((sts) => {
  seatNumbers.push(sts.nextElementSibling.innerText);
});
console.log(seatNumbers);
<div class="row">

  <div class=" available seat" data="C-08"></div>
  <label>C-08</label>

  <div class=" available seat" data="D-08"></div>
  <label>D-08</label>

  <div class=" available seat" data="E-08"></div>
  <label>E-08</label>


</div>
0
hgb123 19 Aug. 2020 im 04:17

Sie können map from javascript verwenden, um ein Array zurückzugeben. Beispiel

const seatNumbers = selectedSeats.map(sts => sts.nextElementSibling.innerText);

Dadurch werden alle Sitznummern in der gleichen Reihenfolge der ausgewählten Sitze zurückgegeben.

0
Aayush Mall 19 Aug. 2020 im 04:16