独自の HTML タグはどのように使われる？


サイトのページのソースを見ていると時々オリジナルのタグ？を使用しているのを見かけますが、何のためにそのようにしているのでしょうか。

また、独自タグで書いた場合タグとしての機能はないのでしょうか。それともどこかで定義をしてあり、意味を持っているのでしょうか。

具体例で言いますと、メルカリで以下のようなタグを使っていました。

[code]

    <mer-heading class="layout__PageHeading-sc-1lyi7xi-3 gePojK" title-label="出品した商品" centered-on-mobile="" level="1" mer-defined=""></mer-heading>
    
[/code]




メルカリは[標準のカスタム要素](https://developer.mozilla.org/ja/docs/Web/Web_Components/Using_custom_elements)のAPIを使っているようですね。

カスタム要素を使うメリットは、要素を再利用可能はコンポーネントとして扱いやすくなることです。  
たとえば「うちのサイトの全ページでは見出しはこういうスタイルでこういう挙動を持っている」と決まっているとして、その見出しに必要なスタイルとJavaScriptコードを正しく全ページに設置しなければなりません。HTMLクラス名やJavaScriptの関数名などの衝突にも細心の注意を払う必要があります。カスタム要素としてきちんと開発しておくと、JavaScriptコードで定義を登録しておけばあとは要素をHTMLの中に書くだけで利用できるようになります。

