4

私は MooTools が初めてで、既存のコードを変更する必要があります (通常は jQuery を使用しています)。

MooTools を使用して dom を検索すると、IE でのみ他の結果 (無効な結果) が得られます。

たとえば、html ソースの一部:

<a class="dmnmlk" rel="dmnml='post'" /></a>
<a href="#" /></a>
<a href="#" /></a>
<a class="blueLink" rel="external" href="http://www.linkedin.com" /></a>
<a rel="external,twitter='txxxxxxxxxxxxxxxxx',data={'border-color':'#634e42','chrome':'noheader nofooter transparent',polite:'polite',limit:10}" class="twitter-timeline" href="https://twitter.com/test" /></a>
<a rel="mlink" /></a>
<a rel="mlink" /></a>
<a rel="mlink" /></a>
<a rel="mlink" /></a>
<a><span /></a>
<a rel="mlink" /></a>
<a rel="mlink" class="selected" /></a>
<a rel="mlink" class="selected" /></a>
<a rel="mlink" class="selected" /></a>
<a rel="svg" class="sprites menuLogo" href="#" title="Go to startpage" /></a>
<div class="resources hidden">
   <div class="dialog">
     .............
   <a class="button" rel="modalresult='ok'>OK</a>
   <a class="button" rel="modalresult='cancel'>Cancel</a>
</div>

var aElems = $('a[rel]:not(.resources a[rel],.disabled),a[href*="#"]:not(a[rel])');

alert( aElems.length );

IE 以外のブラウザの場合: カウントは 14 IE のみの場合: カウントは 2

最新の mootools バージョンを使用しています。

誰かが何が起こっているのか説明できますか? これについて何ができますか？

編集：私がやろうとしていることの説明：

html の rel タグを含むリンクをスキャンして、機能をそれにバインドします。HTML5 で data 属性を使用できるようになったことはわかっていますが、これは古い IE バージョンでも機能する必要があります (私は XHTML strict を使用しています)。これにはいくつかの理由があります。

  • 高速で、DOM を 1 回だけスキャンする

  • スケーラビリティ、特定の名前の rel 属性が html に存在しない場合、関連付けられた関数は実行されません

  • コンパクトで、すべての機能を競合することなく 1 つのファイルに収めることができ、非常にクリーンで明確です。

  • 動的なもので使用できます ajax、ダイアログ、機能は、rel 属性で既に指定されているため、特定の機能を設計する必要なく、新しい html が読み込まれたときに自動バインドできます。

  • 安定性: 関数が存在しないか、rel 属性が存在しない場合、コードは壊れません。

私はこの手法を数年間 (jQuery を使用して) 使用していますが、非常に便利です。たとえば、「AjaxQuery」と呼んでいます。

 // Extend the ajaxquery class
TAjaxQuery.prototype.setupPage = function() // Will be called automaticly
{
 var o = this;

o.onAjaxFoundRelAttrMlink = function( oSender, oData ) // Called when rel="mlink" is found
{
  // oData.target    // Target element
  // oData.rel.mlink // parsed rel attribute
  $(oData.target).bind( 'click', function(e) // i know this is jquery
  {
    // do something
  }); 

  // ..... etc
};

};

リソースはダイアログにすることができるため、機能は表示されている場合にのみバインドする必要があります。これが、リソース内の rel 属性を持つリンクを起動時にバインドしてはならない理由です。ダイアログは動的なものです。それnot(.resources a[rel])が検索クエリにある理由です。

あなたがその考えを理解してくれることを願っています。

4

0 に答える 0