js-Implementierung der blinkenden Titelleiste einer Webseite, Beispiel für den Effekt der Eingabeaufforderung, Analyse_Javascript-Kenntnisse

Das Beispiel in diesem Artikel beschreibt, wie Sie mit js den blinkenden Aufforderungseffekt der Titelleiste einer Webseite erzielen. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

Wir sehen häufig den blinkenden Effekt der Webseiten-Titelleiste in einigen Chat-Tools, z. B. in den aktuellen Chatrooms mit hohem Datenverkehr. Nachfolgend fassen wir einen Code zum Realisieren der blinkenden Eingabeaufforderung der Webseiten-Titelleiste zusammen , Sie können sich darauf beziehen.

Dieser neue Nachrichtenaufforderungseffekt wird in den Projekten des Unternehmens verwendet und dient hauptsächlich dazu, Benutzer daran zu erinnern, dass es neue Nachrichten gibt. Der spezifische Implementierungscode lautet wie folgt:

Code kopieren Der Code lautet wie folgt:

var newMessageRemind={
_step: 0,
_title: document.title,
_timer: null,
//Eingabeaufforderung für neue Nachricht anzeigen
show:function(){
var temps = newMessageRemind._title.replace("【　　】", "").replace("【Neue Nachricht】", "");
newMessageRemind._timer = setTimeout(function() {
newMessageRemind.show();
//Schreiben Sie hier den Cookie-Vorgang
newMessageRemind._step ;
if (newMessageRemind._step == 3) { newMessageRemind._step = 1 };
if (newMessageRemind._step == 1) { document.title = "【　　】" temps };
if (newMessageRemind._step == 2) { document.title = "[Neue Nachricht]" temps };
}, 800);
return [newMessageRemind._timer, newMessageRemind._title];
},
//Eingabeaufforderung für neue Nachricht abbrechen
klar: function(){
clearTimeout(newMessageRemind._timer);
document.title = newMessageRemind._title;
//Schreiben Sie hier den Cookie-Vorgang
}
};

Rufen Sie auf, um die Erinnerung an neue Nachrichten anzuzeigen: newMessageRemind.show();
Rufen Sie an, um die Erinnerung an neue Nachrichten abzubrechen: newMessageRemind.clear();
Nachdem Sie den obigen Code gelesen haben, können Sie ihn selbst optimieren. Es ist gut, wenn Sie ihn aufnehmen und lernen können. :) Ich hatte vor allem das Gefühl, dass das Feld „newMessageRemind“ in seinem Code zu oft verwendet wurde und es zu dicht und unbequem aussah. Ich wollte es auf eine frische Art und Weise darstellen, also habe ich mir den folgenden Code ausgedacht:

Code kopieren Der Code lautet wie folgt:

var newMessageRemind = function () {
var i = 0,
         title = document.title,
         Schleife;

Geben Sie {
zurück show: function () {
              loop = setInterval(function () {
ich ;
If ( i == 1 ) document.title = '[Neue Nachrichten]' title; If ( i == 2 ) document.title = '【　】' title; Wenn (i == 3) i = 0;              }, 800);
         },
Stopp: Funktion () {
                                                                                                             ,,,,,,,,,, ,,,,,,,,,,,,,,,                  document.title = title;            }
};
} ();

Ist es nicht viel frischer? ^_^

Code kopieren

Der Code lautet wie folgt:

stop