Twitterの埋め込み動画がうまく表示されないとき！

ツイッターの埋め込み動画を自分のサイトに載せようとしたのですが、なかなか苦労してしまいました・・。

下記の「Twitter oembed API」によって埋め込みコードを取得して、それをサイトにjqueryで動的に追加しようとしたのですが、なかなか上手くいきません・・。

私のサイトでは自前で「//platform.twitter.com/widgets.js」を読み込みんでいるので、APIの「omit_script」オプションを有効にして「widget.js」無しの埋め込みコードを取得しました。

これをそのままjqueryの「append」によって追加したのですが、動画がうまく表示されません・・。

どうやら「omit_script」を有効にした動画を動的に追加するためには、要素をappendしたあと、下記のようにwidgets.jsの「createVideo()」というメソッドを叩かなくてはいけないようです。

しかし言われた通りに「createVideo()」を叩いても、「document.getElementbyId is not a function」とエラーが出てきてしまうのです・・。

twttr.widgets.createVideo(
  "123456",
  document.getElementbyId("video-hogege"),
  {
    status: "hidden",
  }
);

どうしたものかとう～んと画面を睨んでいると、なんかへんなことに気付きました・・。「getElementbyId」ではなくて「getElementById」なのでは？

「B」の字を修正したら、無事動画を貼り付けることに成功しました。

公式がコード間違えてるなんて、ツイッターったらお茶目なんだから・・。

やったこと