ホームページ > 記事 > ウェブフロントエンド > CSS+DIV+JQuery実践動画まとめ_html/css_WEB-ITnose
ゴボウでCSSとDIVを学び、JS中学でCSS+JSのパッケージングを勉強しましたが、ここで再度復習しました。
css の中核となる内容は、主に標準フロー、ボックスモデル、フローティング、位置決めの 4 つの側面で構成されており、B/S フロントページのレイアウトにおいても決定的な役割を果たします。ボックス モデルは、各要素の特定のサイズ、境界線、間隔を決定するために使用されます。フローティング配置は、ページ上の要素の順序と位置レイアウトに加えて、背景画像や色などのいくつかの基本的な CSS スタイルを決定する標準フローと組み合わせられます。その後、さまざまな形式で Web ページを作成できます。
DIV: CSS における位置決め技術の一種で、別個のモジュールとして表示されます。スパンの反対。 CSS での配置には、position などの相対メソッドと絶対メソッドも含まれており、これらを組み合わせて使用すると、ページをより複雑な配置効果で見せることができます。
JS: CSS によってデザインされたページに動的な効果を与え、他の言語でのクライアントとサーバー間の対話が遅いという問題を解決するには、JavaScript テクノロジを使用できます。JQuery はカプセル化された軽量の JS です。複数のブラウザと互換性のあるライブラリを使用すると、ページ内のさまざまな要素にさまざまな動的効果をより便利にデザインできます。
この 2 つの間には切り離せない関係があります。注意深く分析した結果、JS でアニメーション効果を設計する場合、一見複雑に見える多くの効果は、実際にはページ要素の CSS スタイルを設定することによって制御されることがわかりました。たとえば、画像のフェードインとフェードアウトは不透明度スタイルによって制御されますが、スクロール、加速、減速などのアニメーション効果は、要素の位置とサイズ、DOM 要素属性などの単純な CSS スタイルといくつかの単純な CSS スタイルによってのみ実現されます。 setTimeout や setInterval などのメソッドは、単純な関数によってカプセル化されます。便宜上、JS には CSS スタイルを設定または取得するためのメソッドもいくつか用意されています。漏れ查 CSS で抜けを確認し、フィルターします:
1. 連結を実装します: $() をカプセル化して JQuery オブジェクトを返します。ここで理解される JQuery オブジェクトは、実際には、ブログ フロントエンドの例の Base ベース ライブラリのコア オブジェクトと同じです。コンストラクター オブジェクトを定義することにより、外部呼び出し用のこのオブジェクトのプロトタイプ オブジェクトに対して多くのカプセル化されたメソッドが定義されます。同時に、各実行が完了すると、オブジェクト自体が返されるため、次回も継続的に呼び出しを続けることができます。これはプログラマにとって非常に容易であり、JQuery の Write Less, Do More 設計コンセプトを完全に体現するものでもあります。
2. よく使用されるメソッド:
1. 属性の取得と設定
html(),css(),val(),scrollLeft/Top(),height()/width(),outerWidth(true)/Height ( true)
2. 表示と非表示
Hide() と show()、slideDown() と slideUp()、toggle() と slideToggle()、fadeOut()/fadeIn()// ここに注意してくださいパラメータをゆっくり、速く、通常、または数値として直接使用する
3. アニメーション効果
animate()、dequeue()
4. その他
Is() メソッド、scroll()、appendTo()、プラグインの使用状況、ブラウザのバージョンやブラウザの種類、JSONデータ形式など
上記は、JQuery ビデオで言及されているいくつかの基礎知識の要約です。さらに、ajaxStart() および ajaxStop()、ajaxComplete()、$().get()、$().post() などのいくつかの基本的な AJAX カプセル化関数も含まれています。
要約: CSS と JS の組み合わせにより、今日の Web サイトのリッチでカラフルな Web ページが構成されます。JQuery は、ブラウザーの違いを考慮して、カプセル化する際に、可能な限り機能制御を使用する必要があります。可能な限り管理された方法でカプセル化する必要があります。同時に、カプセル化された JS ライブラリについては、将来独自の JS ライブラリを構築できるように、カプセル化の原理を理解するために最善を尽くして、それが何であるか、なぜそうなるのかを理解する必要があります。