JavaScript: Wie Ausblenden / Einblenden <div>
Ich versuche zu vermeiden, mit innerHTML
weil es bewirkt, dass mein browser stürzt ab, vermutlich wegen der 250 Millisekunden refresh-rate.
Trotzdem, ich hätte lieber einige Inhalte in eine versteckte <div>
und machen die <div>
nur sichtbar, wenn eine bestimmte Bedingung erfüllt ist. Was ist der beste Ansatz, um zu gehen, um dieses?
Im Grunde, was ich jetzt mache ist..
setInterval(function () {
if (serverReachable()) {
.... //lines of code
.... //lines of code
var changeIt = document.getElementById('change')
changeIt.innerHTML = '';
timeout = setInterval(function(){window.location.href = "Tracker.html";},5000);
}
} else {
clearTimeout(timeout);
timeout = null;
var changeIt = document.getElementById('change')
changeIt.innerHTML = 'offline';
}
}, 250);
Dieser stürzt mein browser, weil ich bin nicht mit innerHTML
drucken "offline", aber eine ganze <div>
. Ich will diese <div>
versteckt, und statt der Verwendung innetHTML
einfach einblenden, wenn eine Bedingung erfüllt ist (in diesem Fall, keine internet-Verbindung).
- Ich würde die
setInterval()
zu einer rekursiv aufgerufensetTimeout()
- das sollte nicht sein, stürzt Ihr browser. Gewiß, die inneresetInterval
sollte einsetTimeout
- ein Zeit-Ereignis.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Dann mithilfe von CSS zum ausblenden und einblenden der div. Können Sie etwas wie das hier tun:
machen das div verschwinden. Und
wieder zu zeigen.
visibility
noch nimmt Platz auf der Seite, in der Erwägung, dassdisplay = 'none'
im wesentlichen entfernt es -, die Sie verwenden, ist abhängig von Ihrer situation.Legen Sie die
display
CSS-Eigenschaft des div -none
.https://developer.mozilla.org/en-US/docs/CSS/display
Beispiel für die Einstellung programmgesteuert mit Javascript: http://jsbin.com/ezanuv/1/edit
changeIt.style.display = 'none';
Können Sie entweder setzen Sie die display-Eigenschaft auf none oder visibility-Eigenschaft auf hidden.
Ich lieber mit css-Eigenschaft display. Ich habe einen lauffähigen code, die ich vor kurzem geschrieben. Seine sehr einfachen und skalierbaren sowie.
Der beste Weg ist, um die display-none ausgeblendet und block für sichtbar
//das element ist der div, die Sie ein-oder ausblenden möchten
element.Stil.Anzeige = (element.Stil.display == "block") ? "none": "block";