Question

我正试图像这样编号DL，

<ul>
    <li>
        <dl>
            <dt>**1**</dt>
            <dd>...</dd>
        </dl>
        <dl>
            <dt>**2**</dt>
            <dd>...</dd>
        </dl>
    </li>
</ul>

<hr>

<ul>
    <li>
        <dl>
            <dt>**3**</dt>
            <dd>...</dd>
        </dl>
        <dl>
            <dt>**4**</dt>
            <dd>...</dd>
        </dl>
        <dl>
            <dt>**5**</dt>
            <dd>...</dd>
        </dl>
    </li>
</ul>

所以我对此进行了评估，

    $('dl dt').each(function() {
        var mydl = $(this).parents('dl').index;
        $(this).text(mydl);
    })

但不起作用...... 那么，我怎样才能统计和编号整个DL，不管父母不同？请帮我。谢谢。

Answer 1

由于您需要所有dt s

的序号

 $('dl dt').text(function (i) {
     return i + 1;
 })

演示：Fiddle

由于你想设置它的文本，你可以使用.text()，它将接收当前元素的索引作为其第一个参数（基于0的索引）使用的元素集

Answer 2

尝试使用 CSS ，如下所示：

<dl class="faq">

<dt>How much wood would a wood chuck chuck if a wood chuck could chuck wood?</dt>
<dd>1,000,000</dd>

<dt>What is the air-speed velocity of an unladen swallow?</dt>
<dd>What do you mean? An African or European swallow?</dd>

<dt>Why did the chicken cross the road?</dt>
<dd>To get to the other side</dd>

.faq {
    counter-reset: my-badass-counter;
}
.faq dt:before {
    content: counter(my-badass-counter);
    counter-increment: my-badass-counter;
}

<强>参考：

Numbering In Style

How to style the number on a html list?

Answer 3

脚本必须在加载元素时运行，或者放置在body标记的最底部。
和＆＃34;索引＆＃34;是一个功能，你需要＆＃34;（）＆＃34;。试试吧！

<script>
    $(document).ready(function(){
        $('dl dt').each(function() {
            var mydl = $(this).parents('dl').index();
            $(this).text(mydl);
        })
    });

</script>

参考：http://devdocs.io/jquery/index/index

在不同父项内编号整个项目（使用jQuery）

3 个答案: