suchen

Heim >Web-Frontend >js-Tutorial >So implementieren Sie mehrere JavaScript-Effekte in derselben Webseite_Javascript-Kenntnisse

So implementieren Sie mehrere JavaScript-Effekte in derselben Webseite_Javascript-Kenntnisse

WBOY
WBOYOriginal
2016-05-16 16:16:301533Durchsuche

Das Beispiel in diesem Artikel beschreibt, wie mehrere JavaScript-Effekte auf derselben Webseite implementiert werden. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

Wenn das Tag im Allgemeinen zweimal auf einer Webseite erscheint, werden alle JavaScript-Skripte nicht mehr wirksam und können nur einmal angezeigt werden Mit dem Tag „text/javascript“> werden jedoch häufig mehrere JavaScript-Effekte auf derselben Webseite benötigt.

1. Grundlegende Ziele

Montieren Sie zwei JavaScript-Uhren auf der Webseite, von denen eine eine normale Zeit ist, die alle 1 Sekunde läuft, und die andere eine abnormale Uhr, die nur alle 3 Sekunden läuft, nur um dieselbe Webseite zu unterscheiden und zu veranschaulichen . So implementieren Sie mehrere JavaScript-Effekte. Der Effekt ist wie folgt:

2. Produktionsprozess

Methode 1:

Code kopieren Der Code lautet wie folgt:



Schreiben Sie zuerst den zu implementierenden Spezialeffekt in eine Funktion, die Funktionen a (), b (), und verwenden Sie dann onLoad des Körpers, um diese Funktion unmittelbar nach dem Laden der Webseite zu laden.
Clocka() und Clockb() werden basierend auf dem ursprünglichen JavaScript-Code neu geschrieben. Der ursprüngliche JavaScript-Code in lautet wie folgt:





Code kopieren


Der Code lautet wie folgt:


Methode 2: Schreiben Sie den Typ einfach direkt in <script>. Bei dieser Methode kommt es jedoch zu einer gewissen Verzögerung. Wenn zu viele Spezialeffekte vorhanden sind, ist der Effekt nicht gut. </u> </a>Aber die Sauberkeit und Intuitivität des Codierens übertrifft die oben beschriebene Methode völlig. </span> </div>Der Code lautet wie folgt: <div class="codebody" id="code13419"> <br><br><br><br><br>Code kopieren<br> </div> Der Code lautet wie folgt:<p></p> <div class="codebody" id="code91393"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  <br> <html xmlns="http://www.w3.org/1999/xhtml">  <br> <Kopf>  <br> <script>  <br> Funktion clocka() {  <br>             var time = new Date().toLocaleString();  <br>             document.getElementById("clocka").innerHTML = time;  <br>         }  <br> Funktion clockb() {  <br>             var time = new Date().toLocaleString();  <br>             document.getElementById("clockb").innerHTML = time;  <br>         }     <br> </script> 
 
twojs 
 
 
 
<script>  <br> setInterval("clocka()", 1000);  <br> </script> 
<script>  <br> setInterval("clockb()", 3000);  <br> </script> 
 
 
 

希望本文所述对大家的javascript程序设计有所帮助.

Stellungnahme：
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
Vorheriger Artikel：Detaillierte Erläuterung der jQuery-Funktion_jqueryNächster Artikel：Detaillierte Erläuterung der jQuery-Funktion_jquery

In Verbindung stehende Artikel

Mehr sehen