2回目以降の問題

Twitterシェアボタンというのはこんなやつですね。

<a href="https://twitter.com/share?ref_src=twsrc%5Etfw" class="twitter-share-button" data-show-count="false">Tweet</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

ただこれJavaScriptなどで動的に作られている要素の中に含めている場合、2回目以降うまくボタン化してくれません。

window.twttr で解決

widgets.jsが読み込まれた後にwindow.twttrという値が増えてるので、その中のwidgets.loadメソッドを使います。メソッドの引数にはボタン化させたい要素.twitter-share-buttonなどを指定します。

twttr.widgets.load(document.getElementsByClassName('twitter-share-button')[0]);

JavaScript で飯食べたい歴約 9 年、 純( nju33 ) によるノートサイトです。

このサイトではドリンク代や奨学金返済の為、広告などを貼らせて頂いてますがご了承ください。

Change Log