ネイティブHTMLグループ化のためのhrefリンク

Question

最近、マークダウンの文書化が始まりました。すべてのリンクを1か所にグループ化し、参照を呼び出すことで再利用できる非常に便利な機能があります。これにより、文書の保守が大幅に容易になります。

値下げで例えば、再利用可能なリンクのコードは次のようになります

[Abbreviations]: http://pythonhosted.org/Markdown/extensions/abbreviations.html 
[Attribute Lists]: http://pythonhosted.org/Markdown/extensions/attr_list.html 
[Definition Lists]: http://pythonhosted.org/Markdown/extensions/definition_lists.html 
[Fenced Code Blocks]: http://pythonhosted.org/Markdown/extensions/fenced_code_blocks.html 
[Footnotes]: http://pythonhosted.org/Markdown/extensions/footnotes.html 
[Tables]: http://pythonhosted.org/Markdown/extensions/tables.html 
[Smart Strong]: http://pythonhosted.org/Markdown/extensions/smart_strong.html 

これらのリンクは、単にあなたの参照名を呼び出すことにより、ドキュメントの任意の場所で使用することができ、例えば：

* `abbr` -- [Abbreviations][] 
* `attr_list` -- [Attribute Lists][] 
* `def_list` -- [Definition Lists][] 
* `fenced_code` -- [Fenced Code Blocks][] 
* `footnotes` -- [Footnotes][] 
* `tables` -- [Tables][] 
* `smart_strong` -- [Smart Strong][] 

私は多くを検索しましたが、ネイティブHTMLのみを使用して類似の機能は見つかりませんでした。

誰もが考えている？

Answer 1

技術的にはこのは、実行時にJavaScriptで可能です - ハイパーテキスト文書の完全性のために、私は本番環境でそれを助言するものではありませでしょうけれども：

// SET UP REFERENCES OBJECT 
 

 
var references = { 
 

 
    abbr : { 
 
     text : 'Abbreviations', 
 
     hyperlink : 'http://pythonhosted.org/Markdown/extensions/abbreviations.html' 
 
    }, 
 

 
    footnotes : { 
 
     text : 'Footnotes', 
 
     hyperlink : 'http://pythonhosted.org/Markdown/extensions/footnotes.html' 
 
    }, 
 

 
    tables : { 
 
     text : 'Tables', 
 
     hyperlink : 'http://pythonhosted.org/Markdown/extensions/tables.html' 
 
    } 
 

 
} 
 

 

 
// LOOP THROUGH REFERENCES OBJECT 
 

 
Object.keys(references).forEach(function(reference) { 
 

 
    var text = references[reference].text; 
 
    var hyperlink = references[reference].hyperlink; 
 
    var referenceSet = [...document.getElementsByClassName(reference)]; 
 

 
    referenceSet.forEach(function(referenceAnchor) { 
 
     referenceAnchor.setAttribute('href', hyperlink); 
 
     referenceAnchor.textContent = text; 
 
    }); 
 
});

<ul> 
 
<li><a class="abbr"></a></li> 
 
<li><a class="footnotes"></a></li> 
 
<li><a class="tables"></a></li> 
 
<li><a class="abbr"></a></li> 
 
<li><a class="footnotes"></a></li> 
 
</ul>