10

コンテンツを表示/非表示にするために使用する方法は2つあります。

  1. jQuery.append()およびjQuery.remove()を使用して、必要な場合/不要な場合に要素を作成/破棄します。
  2. すでにすべてをhtmlに含めますが、必要に応じてそれらの要素を非表示/無効にします。

では、何がベストプラクティスと見なされますか?どちらの方法でも長所と短所がわかります。

例として、私は人々が彼らのウェブカメラで写真を撮ることができるサイトを持っています。Webカメラが存在するウィンドウは、サイトの他のすべてのコンテンツと重なる別のウィンドウに表示されます。写真を撮ると、ウェブカメラの重なりが再び削除されます。だから私はそれを隠すか、それを挿入/削除することができます。

4

1 に答える 1

11

あなたが言及したアプローチのそれぞれを最大限に活用することができる中間のアプローチがあります。追加と削除を使用して要素を作成および破棄するとおっしゃいました。要素の作成は、それをDOMにアタッチすることとは異なるタスクであることを明確にする必要があります。すなわち

divの作成

var node = $('<div>node content</div>); 

divをアタッチするのとは異なります:

parent.append(node);

したがって、できることは、要素を変数に割り当てて(つまり、変数にキャッシュして)、必要に応じてそれらをアタッチおよびデタッチすることです。このように、要素を破棄した後に使用するたびに同じ要素を作成する必要はありません(したがって、冗長な処理コストが発生します)。

同時に、それをDOMツリーに不必要にアタッチしてから非表示にする必要はありません(つまり、使用していない間は、ページにノードが読み込まれるため、全体的なエクスペリエンスが遅くなり、UI/UXコストが発生します。 、そのうちのいくつかはユーザーによってまったく使用されていません)。

それが最善のアプローチだと思います。

于 2013-02-20T13:40:24.537 に答える