使用javascript、mootools获取HTML元素对象

请在下面查看我的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>

演示1
演示1内容
演示1
演示1内容
演示2
演示2内容
演示3
演示3内容
演示4
演示4内容

以下是我的JS代码：

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

    });
</script>

$$（'.toogler'）。每个（函数（e）{
警报（e）；
//这将提醒所有toogler div对象
});

我的问题是，如何使用class元素获取下一个div的对象

如果我有第一个toogler的对象，那么如何获得下一个第一个div的对象，哪个类是'element'

---

我不想给元素提供ID，你必须一个接一个地迭代并检查类。

给被切换元素分配切换器的最简单方法是：

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

下面是一个工作示例：

---

另外，请删除该表。

如果您不能按照奥斯卡的建议（最佳情况）更改html输出和重构，则以下方法有效：

e.getParent（）.getParent（）.getNext（）.getFirst（）.getFirst（）

-它将返回下一个div，但速度很慢

不幸的是，表break.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]);
});

不过，我不喜欢这两种解决方案，因为它们不够可维护/可扩展。

尝试使用

$$（'.toogler'）。每个（函数（e）{
警报（e）；
//使用class元素获取下一个同级。
var nextElement=e.getNext（'.element'）；
警报（nextElement）；
});

我如何遍历元素？呃，在一个大表上一直调用选择器不会很快。缓存的

$$（“div.element”）

将工作得更好

<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>