JS はコンテンツを表示するためのクリックサイクル切り替えを実装します-jsチュートリアル-php.cn

ホームページ

ウェブフロントエンド

jsチュートリアル

JS はコンテンツを表示するためのクリックサイクル切り替えを実装します

小云云

Jan 09, 2018 am 11:20 AM

javascript スイッチ見せる

この記事では主に、JavaScript のマウスイベント応答、ページ要素の取得、属性設定などの関連する操作テクニックを含む、表示コンテンツのクリックサイクル切り替えを実現する JS メソッドを紹介します。お困りの皆様の参考になれば幸いです。。

最初にランニング効果を見てみましょう:

具体的なコードは次のとおりです:

<!DOCTYPE html> 
<html> 
<head> 
  <meta charset="UTF-8"> 
  <title>www.jb51.net 点击循环切换内容</title> 
  <style> 
    a { 
      cursor: pointer; 
      color: red; 
    } 
    p { 
      display: none; 
    } 
  </style> 
</head> 
<body> 
  <a onclick="con()">循环切换内容</a> 
  <p>11111</p> 
  <p>22222</p> 
  <p>33333</p> 
  <script> 
    //可以换成切换图片等等 
    flag = 0; 
    pre = 0; 
    function con(){ 
      var cons = document.getElementsByTagName("p"); 
      document.getElementsByTagName("p")[pre].style.display = "none"; 
      document.getElementsByTagName("p")[flag].style.display = "inline"; 
      console.log(flag); 
      pre = flag; 
      if(flag == cons.length - 1) { //注意是cons.length-1，因为索引值是从0开始的 
        flag = 0; 
      } else { 
        ++flag; 
      } 
    } 
  </script> 
</body> 
</html>

ログイン後にコピー

ホットAIツール

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

ホットトピック

Gmailメールのログイン入り口はどこですか？

7638

CakePHP チュートリアル

1391

Steamのアカウント名の形式は何ですか

Win11 Activation Key Permanent

NYTの接続はヒントと回答です

150

Related knowledge

win11 home版からprofessional版へ切り替える操作チュートリアル_win11 home版からprofessional版へ切り替える操作チュートリアル Mar 20, 2024 pm 01:58 PM

Win11 Home Edition を Win11 Professional Edition に変換するにはどうすればよいですか? Win11 システムは Home Edition、Professional Edition、Enterprise Edition などに分かれており、ほとんどの Win11 ノートブックには Win11 Home Edition システムがプリインストールされています。今日は、エディターが win11 ホームバージョンからプロフェッショナルバージョンに切り替える手順を示します! 1. まず、win11 デスクトップとプロパティでこのコンピューターを右クリックします。 2. 「プロダクトキーの変更」または「Windows のアップグレード」をクリックします。 3. 入力後、「プロダクトキーの変更」をクリックします。 4. アクティベーションキー 8G7XN-V7YWC-W8RPC-V73KB-YWRDB を入力し、[次へ] を選択します。 5.その後、成功を促すメッセージが表示されるので、win11 home バージョンを win11 professional バージョンにアップグレードできます。

Xiaomi Mi 14Ultraで4gと5gを切り替えるにはどうすればよいですか? Feb 23, 2024 am 11:49 AM

Xiaomi 14Ultraは、今年最も人気のあるXiaomiモデルの1つです.Xiaomi 14Ultraは、プロセッサとさまざまな構成をアップグレードするだけでなく、多くの新しい機能アプリケーションをユーザーにもたらします.これは、Xiaomi 14Ultra携帯電話の販売からもわかります.人気がありますが、まだ知られていない一般的に使用される機能がいくつかあります。では、Xiaomi 14Ultraはどのようにして4gと5gを切り替えるのでしょうか？以下に具体的な内容をご紹介していきます！ Xiaomi 14Ultraで4gと5gを切り替えるにはどうすればよいですか? 1. 電話機の設定メニューを開きます。 2. 設定メニューで「ネットワーク」および「モバイルネットワーク」オプションを見つけて選択します。 3. モバイルネットワーク設定に、[優先ネットワークタイプ] オプションが表示されます。 4. このオプションをクリックまたは選択すると、次の内容が表示されます。

Win10システムでデュアルシステム切り替えを実装する方法 Jan 03, 2024 pm 05:41 PM

Win システムに初めて触れたとき、多くの友人は慣れていないかもしれません。コンピューターにはデュアルシステムがあります。現時点では、実際に 2 つのシステムを切り替えることができます。切り替えの詳細な手順を見てみましょう。 2 つのシステム間で。 win10システムで2つのシステムを切り替える方法 1. ショートカットキーの切り替え 1. 「win」+「R」キーを押してファイル名を指定して実行を開きます 2. 実行ボックスに「msconfig」と入力し、「OK」をクリックします 3. 開いた「」で「システム構成」インターフェイスで、必要なシステムを選択し、「デフォルトとして設定」をクリックします。完了後、「再起動」で切り替えを完了できます。方法 2. 起動時に切り替えを選択します。 1. デュアルシステムの場合、選択操作インターフェイス起動時に表示されます。キーボードの「上下キー」を使用してシステムを選択できます。

Apple コンピュータのデュアルシステムブートモードを切り替える Feb 19, 2024 pm 06:50 PM

起動時に Apple デュアルシステムを切り替える方法 Apple コンピュータは強力なデバイスなので、独自の macOS オペレーティングシステムに加えて、Windows などの他のオペレーティングシステムをインストールしてデュアルシステム切り替えを実現することもできます。では、起動時に 2 つのシステムを切り替えるにはどうすればよいでしょうか?この記事では、Apple コンピュータのデュアルシステムを切り替える方法を紹介します。まず、デュアルシステムをインストールする前に、Apple コンピュータがデュアルシステムの切り替えをサポートしているかどうかを確認する必要があります。一般的に言えば、Apple コンピュータは以下に基づいています。

デスクトップレイアウトがロックされる理由と解決策 Feb 19, 2024 pm 06:08 PM

デスクトップレイアウトがロックされるとどうなりますか? コンピューターを使用しているときに、デスクトップレイアウトがロックされる状況に遭遇することがあります。この問題は、デスクトップアイコンの位置を自由に調整したり、デスクトップの背景を変更したりすることができないことを意味します。では、デスクトップレイアウトがロックされていると表示される場合、具体的には何が起こっているのでしょうか? 1. デスクトップレイアウトとロック機能を理解するまず、デスクトップレイアウトとデスクトップロックの 2 つの概念を理解する必要があります。デスクトップレイアウトとは、ショートカット、フォルダー、ウィジェットなど、デスクトップ上のさまざまな要素の配置を指します。私たちは自由になれる

Excelでブックを切り替えるショートカットキーの使い方 Mar 20, 2024 pm 01:50 PM

Excel ソフトウェアのアプリケーションでは、一部の操作を簡単かつ迅速に行うためにショートカットキーを使用することに慣れています。Excel の複数のテーブル間に関連するデータがある場合があります。それを表示するときに、タスクを常に切り替える必要があります。高速な切り替え方法を使用すると、切り替えにかかる無駄な時間が大幅に節約され、作業効率が大幅に向上します。クイック切り替えを完了するにはどのような方法を使用できますか? この問題に対処するために、今日は編集者がそれについてお話します。内容は次のとおりです。 Excel でブックを切り替えるショートカットキーを使用します。 1. まず、開いた Excel テーブルの下部に複数のワークブックが表示されますが、下の図に示すように、異なるワークブックをすばやく切り替える必要があります。 2. 次に、キーボードの Ctrl キーを動かさずに押し、必要に応じて右側のジョブを選択します。

リモートデスクトップ接続で相手のタスクバーを表示させる方法 Jan 03, 2024 pm 12:49 PM

リモートデスクトップ接続を利用しているユーザーは多いですが、利用中に相手のタスクバーが表示されないなどのちょっとしたトラブルに遭遇する人も多いと思いますが、実は相手の設定の問題である可能性が高いです。以下の解決策。リモートデスクトップ接続時に相手のタスクバーを表示する方法： 1. まず「設定」をクリックします。 2. 次に「個人用設定」を開きます。 3. 次に、左側の「タスクバー」を選択します。 4. 画像の「タスクバーを非表示にする」オプションをオフにします。

簡単な JavaScript チュートリアル: HTTP ステータスコードを取得する方法 Jan 05, 2024 pm 06:08 PM

JavaScript チュートリアル: HTTP ステータスコードを取得する方法、特定のコード例が必要です序文: Web 開発では、サーバーとのデータ対話が頻繁に発生します。サーバーと通信するとき、多くの場合、返された HTTP ステータスコードを取得して操作が成功したかどうかを判断し、さまざまなステータスコードに基づいて対応する処理を実行する必要があります。この記事では、JavaScript を使用して HTTP ステータスコードを取得する方法を説明し、いくつかの実用的なコード例を示します。 XMLHttpRequestの使用

See all articles

JS はコンテンツを表示するためのクリックサイクル切り替えを実装します

ホットAIツール

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

Video Face Swap

人気の記事

ホットツール

メモ帳++7.3.1

SublimeText3 中国語版

ゼンドスタジオ 13.0.1

ドリームウィーバー CS6

SublimeText3 Mac版

ホットトピック