جلب كائن عنصر HTML باستخدام JavaScript، Mootools

Question

يرجى التحقق من HTML أدناه:

<table cellpadding="0" cellpadding="0" border="0">
    <tr>
        <td>
            <div class="toogler">Demo1</div>
        </td>
    </tr>
    <tr>
        <td>
            <div class="element">Demo1 Content</div>
        </td>
    </tr>
    <tr>
        <td>
            <div class="toogler">Demo1</div>
        </td>
    </tr>
    <tr>
        <td>
            <div class="element">Demo1 Content</div>
        </td>
    </tr>
    <tr>
        <td>
            <div class="toogler">Demo2</div>
        </td>
    </tr>
    <tr>
        <td>
            <div class="element">Demo2 Content</div>
        </td>
    </tr>
    <tr>
        <td>
            <div class="toogler">Demo3</div>
        </td>
    </tr>
    <tr>
        <td>
            <div class="element">Demo3 Content</div>
        </td>
    </tr>
    <tr>
        <td>
            <div class="toogler">Demo4</div>
        </td>
    </tr>
    <tr>
        <td>
            <div class="element">Demo4 Content</div>
        </td>
    </tr>
</table>

هنا رمز JS الخاص بي:

<script type="text/javascript" language="javascript">
    $$('.toogler').each(function(e){
        alert(e);
        // this will alert all the toogler div object

    });
</script>

مشكلتي هي كيف يمكنني جلب كائن DIV التالي مع عنصر الفصل

إذا كان لدي كائن من الوحشي الأول، فماذا يمكنني الحصول على كائن أول حرف DIP التالي

لا أريد إعطاء معرفات العناصر

Answer 1

إذا لم تتمكن من تغيير إخراج HTML و Refactor كما اقترحه Oskar (أفضل حالة)، فهذا يعمل:

e.getParent().getParent().getNext().getFirst().getFirst() - سيعود لك الحم القادم ولكنه بطيء.

لسوء الحظ، كسر الجداول .getnext ("div.element") لأنها ليست شقيق.

هناك طريقة أخرى تعمل بهذا (إذا كانت مطابقة أطوالها) - ستكون أسرع بكثير إذا تم وضع المرجع في تخزين العناصر ك 1-OFF:

var tooglers = $$("div.toogler"), elements = $$("div.element");
tooglers.each(function(el, i) {
    console.log(elements[i]);
    el.store("contentEl", elements[i]);
});

أنا لا أحب أي حل رغم أنه غير قابل للصيانة / قابلة للتطوير بما فيه الكفاية.

Answer 2

يجب عليك التكرار من خلال وفحص الفصل واحدا تلو الآخر.

Answer 3

أسهل طريقة لتعيين Togglated إلى عنصر التبديل:

$$('.toogler').each(function(e, index){
    console.log($$('.element')[index]);
});

إليك مثال على العمل: http://jsfiddle.net/oskar/atabb.

أيضا، تخلص من الطاولة.

Answer 4

جرب استخدام Element.GetNext ([المباراة]).

<script type="text/javascript" language="javascript">
    $$('.toogler').each(function(e){
        alert(e);

        // Get the next sibling with class element.
        var nextElement = e.getNext('.element');
        alert(nextElement);

    });
</script>