如何用mootools切片?

时间:2011-12-31 23:02:16

标签: javascript mootools

如何使用 mootools 切割元素? 例如,我想在具有“span”子项的所有“li”之前注入“</ul><ul>”(不是<ul></ul>)。 源代码:

<ul>

   <li>
       <a></a>
   </li>

   <li>
       <a></a>
   </li>
<!-- i want insert "</ul><ul>" Here -->
   <li> 
       <span></span>
   </li>

   <li>
      <a></a>
   </li>

   <li>
     <a></a>
   </li>

   <li>
     <a></a>
   </li>

<!-- i want insert "</ul><ul>" Here--> 
   <li>
      <span></span>
   </li>

   <li>
      <a></a>
   </li>

   <li>
      <a></a>
   </li>

</ul>

输出:

<ul>

       <li>
           <a></a>
       </li>

       <li>
           <a></a>
       </li>
</ul>

<ul>
       <li> 
           <span></span>
       </li>

       <li>
          <a></a>
       </li>

       <li>
         <a></a>
       </li>

       <li>
         <a></a>
       </li>

</ul>

<ul>
       <li>
          <span></span>
       </li>

       <li>
          <a></a>
       </li>

       <li>
          <a></a>
       </li>

    </ul>

感谢您的帮助

1 个答案:

答案 0 :(得分:1)

这是mootools Element类的切片函数的可能实现:

Element.implement({
    'slice' : function(keys) {
        var keys = Array.from(keys),
            newParent = false;
        this.getChildren().each(function(child) {
            if(keys.contains(child)) {
                newParent = new Element(this.get("tag"))
                    .inject(newParent?newParent:this, "after");
            }
            if(newParent) 
                newParent.adopt(child);

        }, this);
    }
});
window.addEvent("domready", function() {
    $("toSlice").slice($$(".keyElt"));
});

及其jsfiddle: http://jsfiddle.net/cFukg/1/