Natives JavaScript zur Implementierung einer zufälligen Namensaufruftabelle
|
In diesem Artikelbeispiel wird der spezifische Code der JavaScript-Random-Roll-Call-Tabelle zu Ihrer Information geteilt. Der spezifische Inhalt ist wie folgt Wirkung:
Code:
<!DOCTYPE html>
<html>
<Kopf>
<meta charset="UTF-8">
<Titel></Titel>
<Stil>
.Kasten{
Breite: 300px;
Höhe: 200px;
Rand: 1px durchgezogen #ccc;
/*Position: absolut;
links: 0;
rechts:0;
oben: 0;
unten: 0;
Rand: automatisch;*/
Rand: 100px automatisch;
Textausrichtung: zentriert;
}
h1{
Breite: 150px;
Höhe: 60px;
Zeilenhöhe: 60px;
Textausrichtung: zentriert;
Schriftgröße: 30px;
Hintergrundfarbe: rot;
Rand: 10px automatisch;
}
Taste{
Breite: 100px;
Höhe: 40px;
Hintergrundfarbe: Dodgerblue;
Rand: 0;
Schriftgröße: 24px;
Farbe: #fff;
}
</Stil>
</Kopf>
<Text>
<div Klasse="Box">
<h1></h1>
<button>Starten</button>
<button>Stopp</button>
</div>
<Skript>
var h1=document.getElementsByTagName('h1')[0];
var btn = document.getElementsByTagName("Schaltfläche");
var arr=["Su Chenxu","Zhang Zhiyang","Xiao Ming","Sozialbruder Kun","Yao","Jing Zhen","Jin Tao","Netzwerkmanager","Sozialbruder Chen","Zha Nan","Xue","Baby Mann","Großer Kerl","Schlafender Gott","Long Ye","Ying Er","Nordostbaby","Ke Ke","Sehr junges Mädchen","Gou Dan","Gou Zi","Tian Jiao","Zhi Qiang","Jin Wei","Haitao","Schwester Mai","Xin Feng","Schwester Huan","Er Gou"];
var ind = ranFun(0,arr.Länge-1)
h1.innerHTML=arr[ind];
var Zeitgeber;
btn[0].onclick=Funktion(){
Intervall löschen(Timer)
Timer = Intervall festlegen(Funktion(){
h1.innerHTML=arr[ranFun(0,arr.Länge-1)]
},100)
}
btn[1].onclick=Funktion(){
Intervall löschen(Timer)
}
Funktion ranFun(a,b){
gibt Math.floor(Math.random()*(b-a+1)+a) zurück
}
</Skript>
</body>
</html>Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird. Das könnte Sie auch interessieren:
|
<<: Die Hauptidee zum dynamischen Festlegen von Routing-Berechtigungen in Vue
>>: Tipps zur Verwendung von Vue-Elementen und Nuxt
Artikel empfehlen
Erstellen Sie einen stabilen und hochverfügbaren Cluster basierend auf MySQL + MyCat, Lastausgleich, Master-Slave-Replikation und Lese-/Schreibtrennung
Bei der Optimierung der Datenbankleistung wird im...
Kopieren und Einfügen ist der Feind der Verpackung
Bevor wir über OO, Entwurfsmuster und die vielen o...
Analyse der MySQL-Ansichtsfunktionen und Anwendungsbeispiele
Dieser Artikel veranschaulicht anhand von Beispie...
Detaillierte Erläuterung des Prozesses zum Bereitstellen des verteilten Konfigurationscenters Apollo mit einem Klick mithilfe von Docker Compose
Einführung Wenn wir über Verteilung sprechen, müs...
28 berühmte Beispiele für Blog-Redesigns
1. WebDesignerWall 2. Veerles Blog 3. Lernprogram...
Analyse der Unterschiede zwischen Mysql InnoDB und MyISAM
MySQL unterstützt viele Arten von Tabellen (d. h....
Tipps zum Erstellen von HTML-E-Mails, die in herkömmlichen Postfächern normal angezeigt werden können
Tipps zum Senden von HTML-E-Mails: Verwenden Sie ...
So löschen Sie den Timer elegant in Vue
Inhaltsverzeichnis Vorwort Optimierung Ableitungs...
Detaillierte Erklärung, wie eine SQL-Anweisung in MySQL ausgeführt wird
Überblick Ich habe vor Kurzem begonnen, mir Wisse...
So installieren Sie FastDFS in Docker
Ziehen Sie das Bild Docker-Pull-Saison/FastDFS:1....
Mehrere Möglichkeiten, das Problem des Schwebens zu lösen, das dazu führt, dass die Höhe des übergeordneten Elements in CSS zusammenbricht
In der Vergangenheit wurde Float häufig für das L...
Eine kurze Analyse der CSS-Selektorgruppierung
Selektorgruppierung Angenommen, Sie möchten, dass...
Erstellung von Webseiten – Grundlegende Deklaration – Dokumenttypbeschreibung (DTD
Die Verwendung von CSS-Layouts zum Erstellen von W...
MYSQL METADATA LOCK (MDL LOCK) MDL-Sperrproblemanalyse
1. Einleitung MDL-Sperren in MySQL haben schon im...
Verstehen Sie die Implementierung des Nginx-Standortabgleichs in einem Artikel
Da das Team Front-End und Back-End trennt, überni...