<template>タグ内の「壊れた」リンク

Question

最近、テンプレートライブラリを使用して処理するHTMLの<template>タグを使用し始めました。

<template id="tmpl"> 
    <div class="something"> 
    <a href="/pages/{{link}}">{{title}}</a> 
    </div> 
</template> 
... 
<script> 
var output = Mustache.render($('#tmpl').html(), { 
    link: 'abc', 
    title: 'abc' 
}); 
</script> 

しかし、私はこれは私が私のHTMLでのリンク切れ（example.com/pages/{{link}}）を持っていることを意味実現するために来ています。これは懸念事項です。さまざまなクローラが無効と見なす可能性があります（実際には、Google Search Consoleでホームページがリンク切れと報告されています）。

1. <template>をこのように使用できますか？

2. （handlebars.js websiteに表示されているように）代わりに<script type="text/template">のように入れてください。

Answer 1

出力変数は、我々が期待するHTMLを、含まれていない、すなわち、レンダリングされたテンプレート。しかし、あなたのコードはの出力変数の内容をどこにも書きません。

<template id="tmpl"> 
    <div class="something"> 
    <a href="/pages/{{link}}">{{title}}</a> 
    </div> 
</template> 

<span id="output"></span> 

<script> 
var output = Mustache.render($('#tmpl').html(), { 
    link: 'abc', 
    title: 'abc' 
}); 
$('#output').html(output); 
</script> 

Googleが正しく、このためのテストサイトIの設定をクロールしていない。ここで

は実施例です。しかし、GoogleBotに自分のバージョンのコードを表示するように頼んだとき、template要素内のリンク、つまり*{{title}}*とレンダリングされたテンプレートリンク、つまり*abc*が表示されました。 template要素にリンクが壊れているとGoogleからは言われても、実際にユーザーが閲覧したときは表示されません。

リンクを切断したことを示すGoogleを終了させる方法の1つは、templateタグを<!--googleoff: anchor--> ...templates... <!--googleon: anchor-->で囲むことです。これらのタグは、内に含まれるアンカータグのインデックスからGooglebotを停止します。

例：

<!--googleoff: anchor--> 
<template id="tmpl"> 
    <div class="something"> 
     <a href="/pages/{{link}}">{{title}}</a> 
    </div> 
</template> 
<!--googleon: anchor-->