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)。我这样做有几个原因:

  • 速度很快,只扫描一次 DOM

  • 可扩展性,当html中不存在具有特定名称的rel属性时,永远不会执行关联的函数

  • 紧凑,所有功能都可以放在一个文件中而不冲突,非常干净清晰

  • 可以与动态的东西一起使用 ajax,对话框,功能可以在加载新的 html 时自动绑定,而无需设计特定的功能,因为它已经在 rel 属性中指定。

  • 稳定性,如果一个函数不存在或者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