同じ Web ページに複数の JavaScript 効果を実装する方法_JavaScript スキル

この記事の例では、同じ Web ページに複数の JavaScript 効果を実装する方法を説明します。皆さんの参考に共有してください。具体的な分析は次のとおりです。

一般的に、 タグが Web ページ上に 2 回出現すると、すべての JavaScript スクリプトは有効になり、1 回しか出現できなくなります。 "text/javascript" タグを使用しますが、同じ Web ページ内で複数の JavaScript 効果が必要になることがよくあります。

1. 基本的な目標

Web ページに 2 つの JavaScript クロックをマウントします。1 つは 1 秒に 1 回実行される通常の時間で、もう 1 つは同じ Web ページを区別して説明するためだけに、3 秒に 1 回のみ実行される異常なクロックです。 . 複数の JavaScript エフェクトを実装する方法。効果は以下の通りです:

2. 製造工程

方法 1:

コードをコピーします コードは次のとおりです。

<スクリプトタイプ="text/javascript"> function Clocka() {
var time = new Date().toLocaleString(); document.getElementById(" Clocka").innerHTML = 時間;                                                                                                               関数 a(){
クロックカ(); setInterval("クロックカ()", 1000); }
function Clockb() {
var time = new Date().toLocaleString(); document.getElementById("クロックb").innerHTML = 時間;                                                                                 関数 b(){
クロックb(); setInterval("クロックb()", 3000); }


<ボディ onLoad="a(),b()">

まず、関数 a()、b() に実装する特殊効果を記述し、Web ページの読み込み直後に本体の onLoad を使用してこの関数を読み込みます。
Clocka() と Clockb() については、元の JavaScript コードに基づいて書き換えられます。 の元の JavaScript コードは次のとおりです。




コードをコピー


コードは次のとおりです。

方法 2: タイプを記述するのではなく、直接タイプを記述するだけです。ただし、この方法では特殊効果が 1 つずつ読み込まれるため、効果が悪くなります。 しかし、コーディングの簡潔さと直観性は上記の方法を完全に上回っています。

コードは次のとおりです:





コードをコピー

コードは次のとおりです:

 
 
 
<スクリプト> 
function Clocka() {
            var time = new Date().toLocaleString(); 
            document.getElementById(" Clocka").innerHTML = 時間; 
        }
function Clockb() {
            var time = new Date().toLocaleString(); 
            document.getElementById("時計b").innerHTML = 時間; 
        }
 
 
 
 
 
 
<スクリプト> 
setInterval("クロックカ()", 1000); 
 
<スクリプト> 
setInterval("クロックb()", 3000); 
 

 

 
 

ここで説明されている大家向けの JavaScript プログラムの設計が役立つことを望みます。