jQuery自动标题编号 [英] jQuery automatic heading numbering
本文介绍了jQuery自动标题编号的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我在网站上有10-15个H2标签字幕的文章.像那样.
I have articles on website with 10-15 H2 tag subtitles. Something likes that.
<h1>Name of article</h1>
<h2>Subtitle</h2>
<p>.....</p>
<h2>Subtitle</h2>
<p>.....</p>
<h2>Subtitle</h2>
<p>.....</p>
<h2>Subtitle</h2>
<p>.....</p>
因此,问题是jQuery如何自动给每个H2标签(字幕)编号?
So, question is how to give number for each H2 tag (subtitle) automatically by jQuery in descending order?
<h1>Name of article</h1>
<h2>15.Subtitle</h2>
<p>.....</p>
<h2>14.Subtitle</h2>
<p>.....</p>
<h2>13.Subtitle</h2>
<p>.....</p>
<h2>12.Subtitle</h2>
<p>.....</p>
我知道如何通过CSS计数器来做到这一点,但是文章可以包含不同数量的字幕.我已经检查了类似的使用jQuery自动对标题H1-H6进行编号主题,但这不是我想要的.
I know how to do it via CSS counters, but articles can contain different numbers of subtitles. I've checked similar Automatic Numbering of Headings H1-H6 using jQuery topic, but it is not i want exactly.
推荐答案
这应该有帮助
var h2Elements = $('.content').find('h2');
var h2ElemCount = h2Elements.length;
$(h2Elements).each(function(i) {
$(this).prepend(h2ElemCount - i + '. ');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div class="content">
<h1>Name of article</h1>
<h2>Subtitle</h2>
<p>.....</p>
<h2>Subtitle</h2>
<p>.....</p>
<h2>Subtitle</h2>
<p>.....</p>
<h2>Subtitle</h2>
<p>.....</p>
</div>
这篇关于jQuery自动标题编号的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文