2

私がますます目にする現象は、要素の種類や UI パターンに結び付けられるのではなく、特定のページの特定の要素に結び付けられる Javascript コードです。

たとえば、ページにいくつかのアニメーション メニューがあるとします。

<ul id="top-navigation">
    ...
</ul>

<!-- ... -->

<ul id="product-list">
    ...
</ul>

これら 2 つのメニューは、同じページまたは異なるページに存在する可能性があり、一部のページにはメニューがない場合があります。

次のような Javascript コードをよく見かけます (これらの例では、jQuery を使用しています)。

$(document).ready(function() {
    $('ul#top-navigation').dropdownMenu();
    $('ul#product-selector').dropdownMenu();
});

問題に気づきましたか？

Javascript は、UI パターン自体ではなく、UI パターンの特定のインスタンスに密接に結合されています。

代わりにこれを行う方がはるかに簡単 (かつクリーン) ではないでしょうか? -

$(document).ready(function() {
    $('ul.dropdown-menu').dropdownMenu();
});

次に、「dropdown-menu」クラスを次のようにリストに配置できます。

<ul id="top-navigation" class="dropdown-menu">
    ...
</ul>

<!-- ... -->

<ul id="product-list" class="dropdown-menu">
    ...
</ul>

この方法には、次の利点があります。

  • より単純な Javascript -クラスに1 回アタッチするだけで済みます。
  • 特定のページに存在しない可能性のある特定のインスタンスを探すことは避けています。
  • 要素を削除すると、その要素のアタッチ コードを見つけるために Javascript を探し回る必要がなくなります。

これに似た手法は、alistapart.com の特定の記事によって開拓されたと思います。

これらの単純な手法がいまだに広く採用されていないことに驚いています。また、UI パターンではなく UI インスタンスを直接参照する「ベスト プラクティス」のコード サンプルや Javascript フレームワークを今でも目にします。

これには何か理由がありますか？今説明した手法に、私が気付いていない大きな欠点はありますか?

4

2 に答える 2

1

まず第一に、一般的に、クラス アプローチを使用する方が優れていることに同意します。

しかし、コードと UI の結合が少ないとまでは言えません。考えてみると、コードが ID "foo" とクラス名 "foo" を想定している場合でも、UI を操作するときにそれを知っておく必要があります。それらの間にはまだ「契約」があります.IDまたはクラスを通じて会うかどうかは、実際には違いはありません.

私が想像するクラス アプローチを使用することの 1 つの欠点は速度です。クラスによって潜在的に複数の要素を見つけるよりも、ID によって特定の要素を見つける方が速いはずです。ただし、違いはおそらく完全に無視できます。

ただし、コードが複数の動作をアタッチするように設計されている場合、2 つのドロップダウンの例のように、クラスを使用する方が確かに理にかなっています。コードはもう少し一般化されており、コードを変更せずに UI をカスタマイズできる可能性が高いため、結合が少なくなります。

あなたの両方の例で私が変更したいことの1つは...なぜセレクターにULがあるのですか? ターゲットが UL の場合にのみ機能する可能性があることをコードが認識している場合、それは 1 つのことですが、その場合は、セレクターで UL を回避し、コードが意味のあるエラーをスローするようにすることをお勧めします。 target が UL ではないことが判明した場合は、ページが理由を示さずに何もしないようにします (たとえば、UI が ID/クラスを OL に設定したため)。

つまり、「ul.foo」ではなく「#foo」または「.foo」などです。

セレクターは右から左に評価されるため、UL が何らかの形でセレクターをより効率的にすると誰かが考える場合、そうではないことを指摘しておく必要があります。

于 2010-06-07T05:44:44.217 に答える
1

あなたのアプローチが優先されます。

人々がさまざまな方法で物事を行う理由は、それが可能であり、それが今でも機能しているからです。

于 2010-06-07T05:45:10.117 に答える