In Website nur DIV periodisch aktualisieren

Hi,

ich hoffe mal, dass ich das jetzt richtig verstehe. Mit JQuery kannst du 
das so machen:

1

$("#time").load(location.href + " #time > *", "");

Das lädt aber jedes Mal die komplette Seite im Hintergrund neu, aber 
übernimmt nur die Daten aus dem div. Besser wäre es, du würdest den 
Inhalt des divs in eine eigene Datei packen und die dann immer mit load 
neuladen.

Wenn es dir nur darum geht die Serverzeit auf der Seite anzuzeigen, 
übertrage nur den Timestamp zum Zeitpunkt des Requests und berechne den 
Rest Clientseitig. Beispiel: https://jsfiddle.net/kmm2dj2n/6/

Guten Morgen,
@Daniel:
Danke, den Link habe ich gesehen, versuche ich zu implementieren wenn 
ich es nicht anders hin bekomme.

@Hans: Leider kein konstruktiver Beitrag und irgendwie am Problem 
vorbei... :-(

@Felix: Das ist das was ich wollte. Danke sehr!! Leider funktioniert es 
nicht :-(

Der Zeitstempel kommt beim ersten Laden der Zeit und ist dann leer nach 
dem Refresh, ich hab das im Screenshot mal eingekreist.

Hab das mal mit einfachen und doppelten "Gänsefüßchen" versucht, immer 
dasselbe.
Woran liegt das? Ich hatte das schon so am Laufen, dass die  Seite 
periodisch komplett geladen wird, da kam der Zeitstring immer.
Auch verstehe ich die Funktion gar nicht, was bedeutet #time > * ??

Ich wäre für eine kurze Info dankbar.

Gruß
Thomas

Thomas S. schrieb:
> Leider funktioniert es
> nicht :-(

Dann musst du es mal debuggen. Chrome hat z.b. einen Entwicklermodus: 
Wenn du rechtsklickst und dann "Untersuchen" und oben auf den Reiter 
"Network" kannst du live die Ajax Requests sehen, die dein Skript alle 
800ms abschickt. Außerdem wird dir in der Console angezeigt, wenn bei 
ausführung des Skripts ein Fehler auftritt. Du kannst ja mal einen 
Screenshot von dem Network Reiter posten.

Hallo Thomas,

den Syntax von load findest Du hier:

http://api.jquery.com/load/

Du rufst Deinen WebServer über die URL auf und holst mit dem 
entsprechenden Markup die Zeit aus dem Result heraus. Den Tag '#time' 
musst Du durch das DIV ersetzten das im Result die Zeit umrahmt. 
Location.ref musst Du durch die URL Deines Webservers ersetzen.

Gruß
Frank

Hier noch eine reine JS version, ungetestet, in der die Seite neu 
abgerufen und nur die Zeit ausgelesen wird:

1

setInterval(function(){

2

  var xhr = new XMLHttpRequest();

3

  xhr.responseType = 'document';

4

  xhr.open("GET","#",true);

5

  xhr.onload=function(){

6

    this.response.getElementById("time").innerHTML = this.response.getElementById("time").innerHTML;

7

  };

8

  xhr.send();

9

}, 1000 );

Ich habe mir nicht angesehen, warum die jQuery Variante nicht 
funktioniert, ich vermute aber das der "*" in "#time > *" nur Nodes 
welche eine Instanz  von HTMLElement sind erfasst, und eine Text Node 
ist keine Instanz von HTMLElement.

Hallo Daniel,

leider kenne ich das Response Dokument nicht was vom Webserver gesendet 
wird. Grundsätzlich würde Deine Variante das Ergebnis liefern, 
vorausgesetzt, das Element würde wirklich "time" heißen.

Aber grundsätzlich ist es so, dass das Kommando welches gesendet wird, 
versucht ein Element im Response zu finden, dass die ID "time" hat. Gibt 
es im Response kein Element mit dieser ID wird das Ergebnis immer ein 
leerer String sein.

In JQuery gibt es zwei Möglichkeiten auf den Wert eines HTML Tags 
zuzugreifen. Handelt es sich z.B. um ein INPUT Tag, würde der Zugriff 
mit .val() das entsprechende Ergebnis und bei einem Textelement mit 
.text() liefern.

Wenn mir jemand das Response also den Quellcode des Aufrufs liefern 
könnte, dann kann ich die Entsprechung liefern.

Gruß
Frank

Hallo,
danke für die rege Beteiligung. Ja, ich habe den Web Server von Ulrich 
am Laufen, der schickt mir die Webseite.
Inzwischen habe ich mich ein wenig in HTML und Java script für Anfänger 
eingearbeitet und eine HTML Datei gestrickt die so funktioniert wie ich 
das will.

Das periodische Update war ein Holzweg. Ich sende einen Zeitstempel beim 
Laden der Seite und ziehe dabei die aktuelle Zeit des Clients.
Dann bilde ich die Differenz und update die Client Zeit plus Differenz 
jede Sekunde auf der Seite. Klappt ganz toll.
Ich muss nun nur noch meinen Zeitstempel der biser ein Text war (So, 
11.11.2011 11.11.11 z.B.) in einen Long wandeln und den dann schicken.

Sollte aber nicht das Problem sein.

Wenn es fertig ist werd ich es mal hier anhängen. Muss beruflich weg bis 
Freitag, kann also ein paar Tage dauern.
Das Thema ist also erledigt.

Gruß
Thomas

Soo, die Sache hat mir keine Ruhe gelassen. Hier das Script und es 
funzt!!
Die DIV die angesprochen wird sieht beispielsweise so aus:

<div id="time">1506360600</div>

<script>
    var server_time;
  var client_time=Date.now()/1000;
  var tmp;
  function init()
  {
   var str=document.getElementById("time").innerHTML.toString();
   tmp=str.slice(0,10);//schneidet eventuelle Folgezeichen ab
   server_time=tmp;
   tmp=str.slice(10);
   setInterval(ShowTime,1000);//alle 1000ms
   ShowTime();
  }
  window.onload=init();
  function BuildDate(a)
  {
   var 
time=zeropad(a.getUTCDate(),1)+'.'+zeropad(a.getUTCMonth()+1,1)+'.'+a.ge 
tUTCFullYear()+' 
'+zeropad(a.getUTCHours(),2)+':'+zeropad(a.getUTCMinutes(),2)+':'+zeropa 
d(a.getUTCSeconds(),2);
   return time;
  }
  function ShowTime()
  {
   var d=new Date((server_time-client_time)*1000+Date.now());
   document.getElementById("time").innerHTML = " Web Server Zeit: 
"+BuildDate(d)+"  "+tmp;
  }
  function zeropad(s,n)
  {
    s=s.toString();
    while(s.length<n)s='0'+s;
    return s;
  }
</script>
Das wars!!