However, the content title of this makdown format conversion process is converted to the H2 label, and there is no ID.
A format like this:
标题1
...........内容..........
标题2
...........内容..........
标题3
......
So we can not use the anchor point to achieve.
Is there any way to implement this directory without an anchor point?
Reply content:
However, the content title of this makdown format conversion process is converted to the H2 label, and there is no ID.
A format like this:
标题1
...........内容..........
标题2
...........内容..........
标题3
......
So we can not use the anchor point to achieve.
Is there any way to implement this directory without an anchor point?
No ID can be inserted with JS ID.
This is how the SF article directory is implemented.
The front end extracts all h1,h2,h3 from the article after page rendering is complete to determine the directory structure, and then adds a similar ID to each title articleHeader1
.
Part of the code:
Generate Indexfunction Articleindex () {var $article = $ ('. Article '); var $header = $article. Find (' H1, H2, H3 '); var _html = ' directory structure
'; $ ('. Side '). Append (_html); $ ('. Widget-outline '). css {' width ': $ ('. Side '). Width () + +,//' Left ': $ ('. side '). Offset (). Left + 15,}); var _taglevel = 1; The initial level var _$wrap = $ (' #articleIndex '); The initial wrap $header. Each (function (index) {if ($ (). Text (). Trim () = = = ") {//null title return; } $ (this). attr (' id ', ' articleheader ' + index); Plus id var _tl = parseint ($ (this) [0].tagname.slice (1)); The current taglevel var _$li = null; if (index = = = 0 | | _tl = = = _taglevel) {//first or the same as the previous _$li = $ ('' + $ (this). Text () + ''); _$wrap.append (_$li); } else if (_tl > _taglevel) {//current is greater than the last _$li = $ ('
- ' + $ (this). Text () + '
'); _$wrap.append (_$li); _$wrap = _$li; } else if (_tl < _taglevel) {//current is less than the last _$li = $ ('' + $ (this). Text () + ''); if (_tl = = = 1) {$ (' #articleIndex '). Append (_$li); _$wrap = $ (' #articleIndex '); } else {_$wrap.parent (' ul '). Append (_$li); _$wrap = _$wrap.parent (' ul '); }} _taglevel = _tl; });}