ネイティブ JavaScript プログラミングを使用すると、多くの欠点があることがわかりました: たとえば、要素を取得するのが不便で、場合によってはトラバースが必要になります。トラバーサルでネストが発生する可能性があり、コードがより複雑になり、耐性が低いです。今日は、jQuery を使用して最初の Web ページを実装する方法を説明します。
(1) HTML レイアウト ページを使用する
1) プロジェクト Pro_01 を作成し、プロジェクトの下に Web ページを作成し、index.html という名前を付けます。
2) HTML 内ページ 3 つのボタンを追加します;
1 2 3 |
|
3) HTML ページに 3 つの DIV タグを追加します;
1 2 3 |
|
(2) CSS を使用してページを美しくします
1) この下に作成しますプロジェクト css フォルダー;
2) CSS ファイルを作成し、style.css という名前を付け、index.html の タグの前にファイルをインポートします。
1 2 3 |
|
3) style.css ファイルの下にページ スタイルを追加します。
1 2 3 4 |
|
1 2 3 4 5 6 7 |
|
#2) ダウンロードが完了したら、プロジェクトの下に js フォルダーを作成し、ダウンロードした jquery-3.5.1js ファイルを js フォルダーに置きます;
注: この場合に使用される jQuery のバージョンは次のとおりです。 3.5.1 の場合、jQuery ライブラリ ファイルは js フォルダーの下に配置されますが、デバッグを容易にするために相対パスが使用されます。
3) このファイルを、index.html の タグの前に挿入します。
1 |
|
(4) エフェクトの実装
1)index.html ページの タグの前に <script></script> タグを作成します;
(2) <script></script>タグ内にエントリー関数を記述する
1 2 |
|
Note:
jQueryエントリー関数とJavaScriptエントリー関数の違い:
1 2 3 |
|
1 2 3 |
|
1 2 3 |
|
注: ダウンロードして保存したくない場合は、 jQuery を使用すると、CDN (Content Delivery Network) 経由で参照することもできます。 Staticfile CDN、Baidu、Youpaiyun、Sina、Google、Microsoft はすべて、サーバー上に jQuery を搭載しています。サイト ユーザーが国内の場合は、Baidu、Youpaiyun、Sina などの国内 CDN アドレスを使用することをお勧めします。サイト ユーザーが海外の場合は、Google と Microsoft を使用できます。たとえば、Baidu の CDN を使用する場合は、次の方法を使用できます:
1 2 3 |
|
以上がjQuery は div の表示、非表示、テキストの充填を実装します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。