Mam tablicę mainTitle, że próbuję sprawdzić, czy ciąg istnieje w listOfTitles, a następnie dołącz do #mainTitle. Jeśli nie, dołącz do #otherTitle. Aby to osiągnąć, zapętlam się przez tablicę listOfTitles, aby sprawdzić, czy którykolwiek z wyrównawczych jest zgodny z pierwszym indeksem mainTitle

Moim problemem jest taki ciąg W tym przykładzie, "Online" powinien pojawić się tylko raz w niebieskim tekście, a "Retail" i "Store", który nie istnieje w listOfTitles powinien pojawić się tylko raz w czerwonym tekście.

Próbuję mieć ciąg tylko raz. Jak mogę osiągnąć przy użyciu przyrostu przez całą tablicę, aby sprawdzić, czy jest mecz?

Moim oczekiwanym wynikiem jest mieć tylko 1 "Online", "Retail", and "Store", aby dołączyć, a nie długość ciągu.

const mainTitle = ["Online", "Retail", "Store"]

const listOfTitles = ["Test","Test2","Test3","Test4","Test5","Test6", "Online", "Test7"]


for (let i = 0; i < mainTitle.length; i++) {
 

checkMatch(mainTitle[i])

};

function checkMatch (title) {

for (let i = 0; i < listOfTitles.length; i++) {

if (title=== listOfTitles[i]) {
$("#mainTitle").append(title);
} else {
$("#otherTitle").append(title);
}


}

}
#mainTitle {
color:blue;
}

#otherTitle {
color:red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mainTitle"> </div>
<div id="otherTitle"> </div> 
0
maimok 10 październik 2020, 03:34

1 odpowiedź

Najlepsza odpowiedź

Nie powinieneś być dołączania, ponieważ za każdym razem, gdy pętla działa, coś zostanie dodane. Zamiast tego wymień zawartość elementu docelowego z nowymi wynikami.

const mainTitle = ["Online", "Retail", "Store"]
const listOfTitles = ["Test","Test2","Test3","Test4","Test5","Test6", "Online", "Test7"]
for (let i = 0; i < mainTitle.length; i++) {
  checkMatch(mainTitle[i])
};

function checkMatch (title) {
  for (let i = 0; i < listOfTitles.length; i++) {
    if (title=== listOfTitles[i]) {
      $("#mainTitle").text(title);
    } else {
      // Only append if the title is not already in the element
      if(!$("#otherTitle").text().includes(title)){
        $("#otherTitle").append(title);
      }
    }
  }
}
#mainTitle {
  color:blue;
}

#otherTitle {
  color:red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mainTitle"></div>
<div id="otherTitle"></div>
1
Scott Marcus 10 październik 2020, 00:59