• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

math min/max sprecyzowane użycie

0 głosów
59 wizyt
pytanie zadane 12 stycznia 2020 w JavaScript przez saseta00 Użytkownik (700 p.)

Hejka, pobieram wartości liczbowe poprzez API i za pomocą get.elementbyid wysyłam je do tablicy w htmlu. Jeden wiersz tabeli poniżej:
 

    const response_kucoin = await fetch(hrefkucoin);   
    const kucoin = await response_kucoin.json();   

  document.getElementById("ETH_kuc").textContent = kucoin.ETH.BTC;
  document.getElementById("XMR_kuc").textContent = kucoin.XMR.BTC;
  document.getElementById("DAS_kuc").textContent = kucoin.DASH.BTC;

Czy mogę użyć Math.min oraz Math.max w taki sposób aby spośród tych trzech wartości które są pobrane i wysyłane do htmla, to dla wartości minimalnej zamieniał mi kolor na czerwony, a maksymalnej na zielony?   Np. poprzez zastąpienie  .textContent na: .setAttribute("style", "color:green;") 

Jestem amatorem jeśli chodzi o javascript, tabela trochę wartości ma i też nie chciałbym nieprawidłowo tego zapchać brzydkim kodem aby nie zamulić pobierania wartości. 

Dziękuje bardzo za pomoc. 

1 odpowiedź

+1 głos
odpowiedź 12 stycznia 2020 przez ScriptyChris Mędrzec (179,600 p.)
wybrane 12 stycznia 2020 przez saseta00
 
Najlepsza

Żeby nie powielać przypisywania wartości do textContent dla różnych elementów, możesz stworzyć obiekt, gdzie kluczami będą stringi, których użyjesz jako id, a wartościami będą nazwy propertisów z obiektu kucoin. Następnie użyć metody Object.entries, aby uzyskać tablicę par klucz:wartość, którą można posortować (wtedy pierwszym elementem będzie najmniejsza liczba, a ostatnim największa), przy okazji ustawiając tekst każdemu elementowi w DOM. Na koniec zmienić kolor wybranym elementom.

Przykład:

const map = {
  ETH_kuc: kucoin.ETH.BTC,
  XMR_kuc: kucoin.XMR.BTC,
  DAS_kuc: kucoin.DASH.BTC
};

const mapEntries = Object.entries(map);

const sortedMapEntries = mapEntries.sort((a, b) => {
  document.getElementById(a[0]).textContent = a[1]; // ustaw tekst każdemu elementowi
  return a[1] > b[1] ? 1 : -1; // posortuj rosnąco tablicę wyjściową
});

document.getElementById(sortedMapEntries[0][0]).style.color = 'green'; // pokoloruj pierwszy
document.getElementById(sortedMapEntries[sortedMapEntries.length - 1][0]).style.color = 'red'; // pokoloruj ostatni

 

komentarz 12 stycznia 2020 przez saseta00 Użytkownik (700 p.)
Dziękuje za tak szczegółową pomoc, jestem bardzo wdzięczny.

Podobne pytania

0 głosów
2 odpowiedzi 300 wizyt
pytanie zadane 24 lutego 2018 w JavaScript przez Yashe Dyskutant (7,740 p.)
0 głosów
1 odpowiedź 180 wizyt
pytanie zadane 29 sierpnia 2017 w JavaScript przez Karol Loczeski Użytkownik (820 p.)
0 głosów
1 odpowiedź 275 wizyt
pytanie zadane 19 lipca 2018 w Java przez michaljbjj Początkujący (460 p.)

87,942 zapytań

136,519 odpowiedzi

304,383 komentarzy

58,306 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Sklep oferujący ćwiczenia JavaScript, PHP, rozmowy rekrutacyjne dla programistów i inne materiały

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...