Přidat otázku mezi oblíbenéZasílat nové odpovědi e-mailem JavaScript

Zdravím.
Proč je u toho vždý funkční až ten posledni div?
Muže je mezi sebou popřehazovát, ale vžda jen ten poslední.

<!DOCTYPE html>
<html>
<body>

<div id="shm/teplota_obyvak"" class="data">Žádná data :(</div>
<div id="shm/teplota_koupelna" class="data">Žádná data :(</div>
<div id="shm/teplota_loznice" class="data">Žádná data :(</div>
<div id="shm/teplota_pokoj" class="data">Žádná data :(</div>

<script>
function nactiData() {
  var data = document.getElementsByClassName("data");

  for (var i = 0; i < data.length; i++) {
    var soubor = data[i].getAttribute("id")
   
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        document.getElementById(soubor).innerHTML =
        this.responseText;
      }
    };
    xhttp.open("GET", soubor, true);
    xhttp.send();
  }
}
nactiData();

setInterval(function () {
  nactiData();
}, 10000);
</script>

</body>
</html>
Jsou zobrazeny jen nové odpovědi. Zobrazit všechny
Předmět Autor Datum
Bych měl ještě jeden dotaz. Jak umístit na stránku obrázek tak, aby šel přes JS měnit. Třeba takto.… nový
Leo1 04.04.2019 09:26
Leo1
možno je vhodnejšie do HTML napsať: <div id="obrazok"> <img src="a.png" id="a" class="" alt=""> <i… nový
Mlocik97 04.04.2019 09:41
Mlocik97
Můžete vysvětlit, jak funguje toto?( xhttp. {}; ) xhttp. { if (podminka) { document.getElementById… nový
cina kvality 04.04.2019 21:51
cina kvality
Kde jsi viděl takovou konstrukcí? To snad ani nemůže fungovat. nový
Wikan 04.04.2019 21:56
Wikan
Následující řádek za new XMLHttpRequest(); nový
cina kvality 04.04.2019 21:57
cina kvality
Na tom řádku je toho ale poněkud více. nový
Wikan 04.04.2019 21:59
Wikan
Aha, asi nějaká chyba parsování... Prostě mi to zamlčelo ve všech příspěvcích to, že toho je poněkud… poslední
cina kvality 04.04.2019 22:02
cina kvality

Bych měl ještě jeden dotaz.
Jak umístit na stránku obrázek tak, aby šel přes JS měnit.

Třeba takto.

<script>
var cislo = 1;

if(cislo == 0){document.write("cislo je 0");
}
else{document.write("cislo je 1");
}
</script>

0 = jeden obrazek
1 = jiný obrazek

možno je vhodnejšie do HTML napsať:


<div id="obrazok">
    <img src="a.png" id="a" class="" alt="">
    <img src="b.png" id="b" class="skryt" alt="">
<div>

do CSS:


.skryt {
    display: none;
}

a v JS by ste prepínali triedy.
(ukážka v jQuery)

$("#tlacitko").on('click', function() {
    $("#a").toogleClass("skryt");
    $("#b").toogleClass("skryt");
}

Můžete vysvětlit, jak funguje toto?( xhttp. {}; )


   xhttp. {
      if (podminka) {
        document.getElementById(soubor).innerHTML =  this.responseText;
      }
    };

A chybí tam středník (pokud není nepovinný v dané implementaci, ale v Internet exploreru by to neprošlo)

Problém bude nejspíš v this, je někdy záludné a v určitých případech je nutné si uložit pomocnou proměnnou novethis=this a potom pracovat uvnitř funkce s novethis.

Obecně je to problematika closures, což jsou je věc týkající se toho, zda uvnitř funkce jsou dostupné proměnné z vnější (a jakým způsobem). Funkce ve své podstatě by měly operovat pouze proměnnými, které dostanou v argumentech. Ale tak to není a proto i funkce operují s proměnnými dostupnými z nadřazeného scope (zjednodušeně globální proměnné)

doporučení: není nutné dávat všem prvkům class=data, stačí je dát do nadřazeného bloku:


div(id=prvky)
-span(id=teplota)
-span(id=tlaky)

následně document.querySelectorAll("#prvky > span") 
=> dá seznam 4 prvků

Zpět do poradny Odpovědět na původní otázku Nahoru