如何嵌入YouTube视频到自己的网站

最新推荐文章于 2023-12-13 15:33:19 发布

莎莎小公举

最新推荐文章于 2023-12-13 15:33:19 发布

阅读量1.3k

点赞数

分类专栏：大前端文章标签：前端

本文链接：https://blog.youkuaiyun.com/qq_31930427/article/details/134331815

版权

大前端专栏收录该内容

4 篇文章

订阅专栏

1. 基本使用

<!-- The <iframe> (and video player) will replace this <div> tag. -->
<div id="player"></div>

const tag = document.createElement('script')
tag.src = 'https://www.youtube.com/iframe_api'
const firstScriptTag = document.getElementsByTagName('script')[0]
firstScriptTag?.parentNode?.insertBefore(tag, firstScriptTag)
// This function creates an <iframe> (and YouTube player)
// after the API code downloads.
let player
function onYouTubeIframeAPIReady() {
  // 第一个参数'player‘代表上面div的id
  player = new YT.Player('player', {
    height: '100%',
    width: '100%',
    videoId: 'I2dpEjmMJ0w',
    playerVars: {
      playsinline: 1,
    },
    // events: {
    // iframe加载完毕回调
    //   onReady: onPlayerReady,
    //   onStateChange: onPlayerStateChange,
    // },
  })
}
window.onYouTubeIframeAPIReady = onYouTubeIframeAPIReady

function seekTo() {
  // 跳转到100s
  player.seekTo(100)
}