ホームページ >開発ツール >atom >Atom が HTML リアルタイム プレビューを実装する方法についての簡単な説明

Atom が HTML リアルタイム プレビューを実装する方法についての簡単な説明

青灯夜游
青灯夜游転載
2021-11-18 19:20:014082ブラウズ

AtomHTML リアルタイム プレビューを実装するにはどうすればよいですか?次の記事では、リアルタイム HTML プレビューを実装するための Atom エディターのネイティブおよびプラグインの方法を紹介します。

Atom が HTML リアルタイム プレビューを実装する方法についての簡単な説明

#Atom エディターは HTML リアルタイム プレビューを実装します

1. ネイティブ実装

編集ボックスで Ctrl Shift M を押して、ネイティブ プレビューを開きます。 (CSS スタイルなし)

2. プラグイン atom-html-preview の実装

[ファイル]->[設定]->[インストール]->をクリックして検索します。 atom-html -preview -> ダウンロードし、編集ボックスで Ctrl Shift H を押してプレビュー パネル (CSS スタイル) を開きます。 [関連する推奨事項: atom の使い方チュートリアル ]

3. JavaScript window.onload

window.onload() メソッドWeb ページがロードされた直後に操作を実行するために使用されます。つまり、HTML ドキュメントがロードされた直後にメソッドを実行します。

window.onload() 通常、ページ (画像、CSS ファイルなどを含む) が完全に読み込まれた後にスクリプト コードを実行する要素に使用されます。実行される関数構文は複数あります。

window.onload=function(){
    Func1();
    Func2();
    Func3();
    .....
}

ページがロードされた後、Func1、Func2、および Func3 が順番に実行され、一度だけ実行されます。

4.window.requestAnimationFrame

window.requestAnimationFrame() アニメーションを実行したいことをブラウザに伝えます、次回再描画する前に、ブラウザーが指定されたコールバック関数を呼び出してアニメーションを更新する必要があります。このメソッドでは、コールバック関数をパラメーターとして渡す必要があります。この関数は、ブラウザーが次回再描画される前に実行されます。

【関連する推奨事項:「atom チュートリアル 」】

以上がAtom が HTML リアルタイム プレビューを実装する方法についての簡単な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はcsdn.netで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。