Anfügen zu einer Webseite in Javascript

Question

Was ich tun möchte, ist, dass: eine Webseite mit Inhalten kontinuierlich zu aktualisieren. (In meinem Fall ist die Aktualisierung all 2s) Neuer Inhalt an den alten angehängt wird, statt zu überschreiben.

Hier ist der Code, den ich habe:

var msg_list = new Array(
    "<message>Hello, Clare</message>", "<message>Hello,Lily</message>",
    "<message>Hello, Kevin</message>", "<message>Hello, Bill</message>"
);
var number = 0;
function send_msg()
{
 document.write(number + " " + msg_list[number%4]+'<br/>');
 number = number + 1;
}
var my_interval = setInterval('send_msg()', 2000); 

Doch sowohl in IE und Firefox, wird nur eine Zeile gedruckt, und die Seite wird nicht mehr aktualisiert. Interessanter in Chrome, die Linien kontinuierlich ausgedruckt werden, das ist, was ich suche.

ich weiß, dass document.write () aufgerufen wird, wenn die Seite geladen wird nach diesem Link . So ist es auf jeden Fall nicht so, wie die Webseite kontinuierlich zu aktualisieren. Was wird der beste Weg zu erreichen, was ich tun will?

Neuling total in Javascript. Danke.

Lily

Answer 1

Sie können auf die innerHTML Eigenschaft anfügen:

var number = 0;
function send_msg()
{
    document.getElementById('console').innerHTML += (number + " " + msg_list[number%4]+'<br/>');
    number = number + 1;
}

Dieser Code wird die Nachricht an ein Element mit einer ID von console hängen, wie

<div id="console"></div>

By the way, es ist ein schlechte Praxis, um den Anruf setInterval mit einem String.

Stattdessen übergeben Sie die Funktion selbst, wie folgt aus:

var my_interval = setInterval(send_msg, 2000); 

Answer 2

Ich würde mit Blick auf die jQuery-Bibliothek starten. Dies wird Ihnen eine Menge Schmerzen speichern.

Was Sie wollen, ist zu tun, halten eingefügten Zeilen in eine Tabelle, zB mit:

$('table tbody').append('<tr><td>some value</td></tr>');

Answer 3

ich hätte einen div oder einen anderen Behälter, wie diese:

<div id="msgDiv"></div>

Dann schreiben Sie, um es wie mit .innerHTML , wie folgt aus:

var msg_list = new Array(
    "<message>Hello, Clare</message>", "<message>Hello,Lily</message>",
    "<message>Hello, Kevin</message>", "<message>Hello, Bill</message>"
);
var number = 0;
function send_msg()
{
    document.getElementById("msgDiv").innerHTML += number + " " + msg_list[number%4]+'<br/>';
    number++;
}
var my_interval = setInterval(send_msg, 2000); 

Sie können ein funktionierendes Beispiel dieses hier sehen

Answer 4

Das wäre eine ausgezeichnete Gelegenheit für Sie, eine wenig DOM-Programmierung zu erlernen.

das DOM Verwendung der Seite zu aktualisieren, sollte in weniger Aufwand zur Folge hat, als nur mehr verketten HTML hinein. Finden Sie den Knoten möchten Sie die Updates in setzen, und tun eine appendChild auf jeder nachfolgenden Zugabe.

Answer 5

Die Antworten auf diese Frage kann hilfreich sein:

Lizenziert unter: CC-BY-SA mit Zuschreibung

Nicht verbunden mit StackOverflow