ホームページ > 記事 > ウェブフロントエンド > 宿題ヘルプのフロントエンドチュートリアルを模倣する
標準モードの場合
box = margin+border+padding+content(width/height)
奇妙なモードの場合
box = margin+content(border+padding+width/height)
フレックスボックス
レム
詳細は後で追加
相対: テキスト内のそれ自体の位置絶対: 親要素内の非静的に配置された要素に相対的に配置され、配置後にテキスト フローから切り離されます。
静的: 通常のテキスト フロー レンダリング
イベント プロキシの利点
原理はイベント バブリングを使用することです利点
メモリ使用量が多くなり、イベント登録が減少します。たとえば、ul は li のすべてのクリック イベントをプロキシします。 特に動的コンテンツに適しています
欠点
イベントプロキシの一般的な適用は上記の要件に限定する必要があります。すべてのイベントにイベントプロキシが使用される場合、イベントの誤判定が発生する可能性があります。つまり、トリガーすべきではないイベントがイベントにバインドされます。 配列重複排除
<style> .p1{ width:100px; height:100px; background-color:red; left:20px; /*以下两张图分别展示*/ position:relative; position:absolute; } .p2{ width:100px; height:100px; background-color:blue; } </style> <p class='p1'></p> <p class='p2'></p>indexOfを使用できず、要素タイプを考慮する必要がある場合
function f(arr){ var s = []; for(var i = 0;i<arr.length;i++){ if(s.indexOf(arr[i]) == -1){ s.push(arr[i]); } } return s; }
function f(arr){ var s = {}; for(var i = 0;i<arr.length;i++){ var type = typeof arr[i]; var con = type+arr[i]; if(!s[con]){ s[con] = 1; }else{ arr.splice(i,1); i--; } } return arr; }を直接使用してマウスオーバーアバター表示の導入を実装します重要なポイント:
2. 配置を確実に表示し、素早くスワイプしたときに表示されないようにする方法
タイマーの使用
簡単なコードを使用して例を示してみましょう。 。 。
りー
以上が宿題ヘルプのフロントエンドチュートリアルを模倣するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。