Heim Web-Frontend js-Tutorial 利用js实现在浏览器状态栏显示访问者在本页停留的时间_javascript技巧

利用js实现在浏览器状态栏显示访问者在本页停留的时间_javascript技巧

May 16, 2016 pm 05:06 PM
浏览器 Statusleiste

问题描述:在状态栏上显示 ,访问者在本页停留的 时间 (如:您在本页停留了 (如:您在本页停留了 X小时 X分 X秒)

该问题相当于是设计一个计时器,用于显示浏览者在该页面停留了多长时间。要解决该问题,我想到的主要有两种方法。

方法一:利用系统时间。即先设置一个变量,用于获取登录开始时间startTime,然后利用setTimeout()函数让页面不停的刷新,在刷新的同时,获取当前时间nowTime,然后用当前时间减去登录开始时间,即为停留时间。在此就不做详细编写。重点说下下面使用到的方法二来进行实现。

方法二:设置三个变量:second,minute,hour。然后让second不停的+1,并且利用setTimeout实现页面每隔一秒刷新一次,当second大于等于60时,minute开始+1,并且让second重新置零。同理当minute大于等于60时,hour开始+1。这样即可实现计时功能。

方法二代码如下:

复制代码 代码如下:





无标题文档






运行效果如图所示。
利用js实现在浏览器状态栏显示访问者在本页停留的时间_javascript技巧
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Wie zeige ich die lokal installierte 'Jingnan Mai Round Body' auf der Webseite richtig? Wie zeige ich die lokal installierte 'Jingnan Mai Round Body' auf der Webseite richtig? Apr 05, 2025 pm 10:33 PM

Mit lokal installierten Schriftdateien auf Webseiten kürzlich habe ich eine kostenlose Schriftart aus dem Internet heruntergeladen und sie erfolgreich in mein System installiert. Jetzt...

Wie steuern Sie die obere und das Ende der Seiten in den Browser -Druckeinstellungen über JavaScript oder CSS? Wie steuern Sie die obere und das Ende der Seiten in den Browser -Druckeinstellungen über JavaScript oder CSS? Apr 05, 2025 pm 10:39 PM

So verwenden Sie JavaScript oder CSS, um die obere und das Ende der Seite in den Druckeinstellungen des Browsers zu steuern. In den Druckeinstellungen des Browsers gibt es eine Option, um zu steuern, ob das Display ist ...

Warum wirkt sich negative Margen in einigen Fällen nicht wirksam? Wie löst ich dieses Problem? Warum wirkt sich negative Margen in einigen Fällen nicht wirksam? Wie löst ich dieses Problem? Apr 05, 2025 pm 10:18 PM

Warum werden negative Margen in einigen Fällen nicht wirksam? Während der Programmierung negative Margen in CSS (negativ ...

Wie verwende ich lokal installierte Schriftdateien auf Webseiten? Wie verwende ich lokal installierte Schriftdateien auf Webseiten? Apr 05, 2025 pm 10:57 PM

So verwenden Sie lokal installierte Schriftartdateien auf Webseiten. Wenn Sie diese Situation in der Webseitenentwicklung gestoßen haben: Sie haben eine Schriftart auf Ihrem Computer installiert ...

Der Text unter Flex -Layout wird weggelassen, aber der Behälter wird geöffnet? Wie löst ich es? Der Text unter Flex -Layout wird weggelassen, aber der Behälter wird geöffnet? Wie löst ich es? Apr 05, 2025 pm 11:00 PM

Das Problem der Containeröffnung aufgrund einer übermäßigen Auslassung von Text unter Flex -Layout und Lösungen werden verwendet ...

Warum wird ein bestimmtes Div -Element im Edge -Browser nicht angezeigt? Wie löst ich dieses Problem? Warum wird ein bestimmtes Div -Element im Edge -Browser nicht angezeigt? Wie löst ich dieses Problem? Apr 05, 2025 pm 08:21 PM

Wie löst ich das durch User Agent Style Sheets verursachte Anzeigeproblem? Bei Verwendung des Edge -Browsers kann ein Div -Element im Projekt nicht angezeigt werden. Nachdem ich nachgesehen hatte, habe ich gepostet ...

Wie wähle ich den Elementstil korrekt aus und setzen Sie den ersten Klasse 'Rot' in CSS? Wie wähle ich den Elementstil korrekt aus und setzen Sie den ersten Klasse 'Rot' in CSS? Apr 05, 2025 pm 08:24 PM

Wie wähle ich den Elementstil für die erste spezifische Klasse aus und setzen Sie? In der Webentwicklung ist es oft notwendig, Elemente bestimmter Klassennamen zu stylen, insbesondere wenn ...

Wie kann man horizontaler Bildlaufeffekt horizontaler Optionen durch Drehen von Elementen in CSS erreichen? Wie kann man horizontaler Bildlaufeffekt horizontaler Optionen durch Drehen von Elementen in CSS erreichen? Apr 05, 2025 pm 10:51 PM

Wie kann man den horizontalen Scrolling -Effekt von horizontalen Optionen in CSS erreichen? Im modernen Webdesign, wie man einen horizontalen tabellartigen Effekt erzielt und die Maus unterstützt ...

See all articles