Question

所以我有这个Jquery：

    var all = document.getElementsByTagName("h2");

    for (var i=0, max=all.length; i < max; i++) {
        $("h1").after($(all).html());
    }

我正在尝试选择页面上的h2元素，但它似乎只能找到第一个并发布三次。

这是HTML：

        <h1>Oversigt</h1>
    <div class="slide">
        <h2>trin 1</h2>
        <p>Tekst til afsnit 1.</p>
    </div>
    <div class="slide">
        <h2>trin 2</h2>
        <p>Tekst til afsnit 2.</p>
    </div>
    <div class="slide">
        <h2>trin 3</h2>
        <p>Tekst til afsnit 3.</p>
    </div>

以下是JSFiddle

上代码的链接

我想要做的是在h1元素之后发布每个div的每个标题，以便页面显示： Oversigt Trin 1 Trin 2 Trin 3

Answer 1

您忘记使用i。另外，由于你试图这样做，你的元素将被颠倒。这是我的建议

            for (var max = all.length, i = max; i > 0; i--) {
                $("h1").after($(all[i - 1]).html());
            }

演示：http://jsfiddle.net/3FLxu/

编辑：这看起来更干净，但要么工作

            for (var max = all.length, i = max - 1; i >= 0; i--) {
                $("h1").after($(all[i]).html());
            }

Answer 2

尝试以下内容：

var $all = $("h2");
$all.each(function() { $("h1").after($(this).html()) });

我认为你误解了集合在jQuery中的工作方式。第一个被多次显示的原因是因为循环多次调用该方法，但.html()一次只能从集合中的一个元素中获取HTML。因此，它不是抛出错误，而是简单地从集合中的第一个元素中获取HTML。

您也可以使用@Joseph Marikle在评论中提供的以下内容：

var all = document.getElementsByTagName("h2");

for (var i=0, max=all.length; i < max; i++) {
    $("h1").after($(all[i]).html());
}

这与您提供的代码更相似，但两者都做同样的事情。

选择并显示他们自己的div中的所有h2元素

2 个答案: