JS はランダム点呼システムを実装します
|
参考までに、JSを使用してランダム点呼システムを実装します。具体的な内容は次のとおりです。 毎回の授業の 10 分前に、先生は私たちに質問に答えるように言いましたが、そのたびに生徒の番号を読み上げ、私が毎回勝っているように思えました。そこで、私は先生に直接、「先生、JS を使用してランダム点呼システムの作成を手伝わせてください」と提案しました。こうすれば毎回選ばれることはないよ、ハハ まず効果を見てみましょう:
コードは次のとおりです。
<!DOCTYPE html>
<html lang="ja">
<ヘッド>
<メタ文字セット="UTF-8">
<meta http-equiv="X-UA-compatible" content="IE=edge">
<meta name="viewport" content="width=デバイス幅、初期スケール=1.0">
<title>ドキュメント</title>
</head>
<本文>
<button id="box1">開始</button>
<button id="box2">終了</button>
<span id="box">トム</span>
<スクリプト>
//ページ内の要素を取得します。var btn1 = document.getElementById('box1');
var btn2 = document.getElementById('box2');
var span = document.getElementById('box');
var names = ['トム', 'ジャック', 'ルーシー', 'ピーター', 'マーク', 'ミン', 'リウ', 'ラニ'];
var タイマー;
btn1.onclick = 関数() {
window.clearInterval(タイマー);
タイマー = window.setInterval(countName, 100);
};
btn2.onclick = 関数() {
window.clearInterval(タイマー);
};
関数 countName() {
var index = parseInt(Math.random() * names.length);
span.innerHTML = 名前[インデックス];
}
</スクリプト>
</本文>
</html>以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 以下もご興味があるかもしれません:
|
<<: Alpine イメージに Ansible サービスを追加する方法
>>: バージョン管理ツール Rational ClearCase の紹介
推薦する
CSS3入力ボックスの実装コードはGoogleログインのアニメーション効果に似ています
CSS3を使用して、Googleログインページと同様の入力ボックスをアニメーション化します。効果1 ...
Webフロントエンドの一般的な操作（JS/HTML/CSSなどの知識を含む）
ul liの前のアイコン1をキャンセルしますクリア値1値を1に設定ラベル中央値1をクリアラベルの中央...
Nginx/Httpd ロードバランシング Tomcat 設定チュートリアル
前回のブログでは、Nginx と httpd を使用して、逆生成用のバックエンド Tomcat サー...
中国語と英語のフォント名の比較表（FounderとArphicを含む）
CSS ファイルでは、フォント名が文字化けしていることがよくあります。これは、作成者が中国語フォン...
Linux yum コマンドを使用して mysql8.0 をインストールする方法の詳細なチュートリアル
1. 設置前によく掃除する rpm -pa | grep mysql または rpm -qa | g...
MySQLプリコンパイル機能の詳細な説明
この記事では、MySQLのプリコンパイル機能について紹介します。具体的な内容は以下のとおりです。 1...
JavaScript タイマーの詳細
目次1. 簡単な紹介2. 間隔を設定する2.1 説明2.2 パラメータ2.3 戻り値2.4 使用法3...
JavaScriptはシンプルな計算機能を実装します
この記事では、参考までに、簡単な計算機を実装するためのJavaScriptの具体的なコードを紹介しま...
MySQLはデータ復旧を実装するためにbinlogログを使用する
MySQL binlog は MySQL ログの中で非常に重要なログであり、データベースのすべての ...
MySQL での Truncate の使用法の詳細な説明
序文：テーブルをクリアしたいときは、truncate ステートメントをよく使用します。ほとんどの場合...
Linux で jar パッケージを起動してバックグラウンドで実行する方法
jar パッケージを実行する Linux コマンドは次のとおりです。方法1: java -jar s...
MySQL を使用した分散ロックの実装
導入分散システムでは、分散ロックは最も基本的なツール クラスです。たとえば、支払い機能を備えた 2 ...
Win7 の VMware 仮想マシンに Linux7.2 をインストールするインターネット アクセス構成チュートリアル
参考までに、win7システム上のVMware仮想マシンにlinux7.2インターネットアクセス構成を...
HTML Selectは、デフォルトの選択を設定するためにselected属性を使用します。
オプションに属性 selected = "selected" を追加すると、それ...
HTML いくつかの特別な分割線効果
1. 基本ライン 2. 特殊効果（効果は独立しておらず、互いに組み合わせることができます） 1. 両...