8

DOM内の特定の数のノードを「指す」jQueryプラグインを作成しています。しかし、プラグインにノードのセットへの参照を保持させるようなことをしようとすると、それらが「古くなる」のではないかと心配します。

（JavaScriptはガベージコレクションされてクラッシュしないことはわかっていますが、リストを最新の状態に保ち、GCする必要のあるものを保持しないようにしたいと思います。）

私が最初に思いついたのは、ある種のフックがあるかもしれないということでした。しかし、信頼できるように見える標準はないようです。

JQueryでは、DOM要素が.remove（）を呼び出したときに関数を実行することは可能ですか？

DOMツリーからの要素の削除に関するコールバック？

jQuery remove（）コールバック？

これにより、ノードにクラス属性を設定してノードのリストを維持することに疑問を抱きました。そうすれば、リストのメンバーシップは一緒に移動します。しかし、恐れているかもしれませんが、これは列挙するのに病理学的に時間がかかる可能性があり、クラスの前にタグとしてクエリを作成することになっている理由です。

潜在的なパフォーマンスの懸念に加えて、プラグインがこの種の目的でDOMノードにクラスをポークするのは貧弱な形式であると考えられているのではないかと思います。これはスタイリングとは関係ありません。（についてのより良いことの1つは.data()、それが比較的帯域外であり、このリストの問題を除いて、私が使用しているものです。）

これは、他のプラグインで対処できる一般的な問題のようです。遅いのですが、「正しさ」のプロパティのためにクラスソリューションを使用したくなります。しかし、両方の長所を生かす、より速く、より標準的な方法はありますか？

4

2 に答える 2

5

jQuery UI がそれを行う方法を信頼します。具体的にはDroppables、それらはjQueryオブジェクトのリストを内部的に維持し、何かがその上に置かれたときに反復処理します。彼らは2つの方法でリストを管理します.

  1. jQuery.remove() の実行時に起動される destroy ハンドラーを追加します。(彼らはこれを行うために jQuerys の remove 関数にフックします) これは単純な javascript の remove を処理しません。
  2. 何かをする前に、それが存在するかどうかを確認してください。

彼らはそれを削除しないと思います.DOMから削除されてから元に戻される可能性があるからです.

于 2011-11-25T16:45:38.043 に答える
1

これを壊して申し訳ありませんが、「信頼できるjQueryベースのコード」という用語は矛盾しています。FWIW:

jQuery は、現在人気のある他のいくつかのスクリプト フレームワークと同様に、 W3C DOM Level 2+ Core (略して)のインターフェイスをArray実装するオブジェクトではなく、クエリ結果を保持するために のようなオブジェクトを作成します。Aはライブです。ホストオブジェクトではなく、ネイティブの ECMAScript オブジェクトであるようなオブジェクトは (通常) そうではありません。NodeListNodeListNodeListArray

このようなフレームワークを使用しない場合、すべての (準) 標準 DOM メソッド ( などgetElementsByClassName()) およびプロパティ ( など) が(場合によってはdocument.forms) を返す/生成するため、この問題は発生しません。NodeListHTMLCollection

DOM Level 2 Eventsはミューテーション イベント タイプを指定しましたが、DOM Level 3 Events ( Working Draft ) の時点でそれらは非推奨になり、その上のフックは現在信頼できず、おそらく相互運用性さえありません。

そのため、jQuery の結果やミューテーション イベントではなく、(準) 標準メソッドを使用する必要があります。

ただし、それでも jQuery(-ish) の方法 (他のすべての目に見えない欠点がある) を使用したい場合は、NodeのparentNodeプロパティを確認する必要があります。 NodeノードではないDocumentが、ドキュメント ツリー内にある s には非null parentNodeプロパティ値があります (一方、nullは W3C DOM レベル 2+ コア仕様の言語に依存しないと理解されるnullため、型変換されるすべての値を探す必要があります。trueECMAScript 実装で)。したがって、他のすべてのNodes には のparentNodeプロパティ値があるため、ECMAScript 実装でnull型変換されるもの。false

要素がs でmyNodesあるインスタンスを参照し、そのようなノード オブジェクトの 1 つを参照すると仮定すると、次のように動作するはずです。ArrayNodemyNode

var i = 0;

/* … */

var myNode = myNodes[i];
if (!myNode.parentNode)
{
  myNodes.splice(i, 1);
}

myNodes次に、 through と呼ばれる関数などでときどき反復しwindow.setInterval()、そこから「古い」ノードを削除することができます。確かに a ほど良くはありませんが、NodeListjQuery を使用せずにノードが削除された場合や、ミューテーション イベント タイプがランタイム環境でサポートされていない場合でも機能します。

残念ながら、インスタンスjQuery()への参照を返しません。Arrayしたがって、最初に次のように作成する必要があります。

var jqObj = jQuery("…");

/* or jQuery.makeArray(jqObj) */
var a = Array.prototype.slice.call(jqObj, 0);

(ここでは、によって参照されるオブジェクトがプロパティjqObjを持っているという事実を使用していlengthます。)

jQuery プラグインに適したスタイルとは何かは言えません。その理由は今では明らかなはずなので、そもそも jQuery を使用しないようにしています。

また、JavaScript などのプログラミング言語*と、それらと一緒に使用できる (通常は言語に依存しない) API (DOM など)を区別することも学ぶ必要があります。

HTH。

于 2011-12-02T01:07:37.480 に答える