Question

当使用YouTube嵌入式API播放新视频时，目前正在努力弄清楚如何使用YouTube标题更新一串文字。

以下是我要更新的相关HTML细分：

<div id="bottom-song-title" class="song-name">No song is playing</div>

这是我当前的API代码（此代码的大部分用于暂停播放和进度条），我认为这是我想要正确使用的功能吗？：

function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.ENDED) {
        console.log("END!");
        clearTimeout(timeout_setter);
        document.getElementById("progress-bar-bottom").style.cssText = "transition: none;";
    } else if (event.data == YT.PlayerState.PLAYING) {
        console.log("PLAYING");
        loopy();
        document.getElementById("progress-bar-bottom").style.cssText = "transition: all 1s linear 0s;";
    } else {
        console.log(event.data);
    }

    var state = player.getPlayerState();
    if (state == 1) {
        jQuery('#media-toggle').click(function (event) {
            player.pauseVideo();
        });
    } else {
        jQuery('#media-toggle').click(function (event) {
            player.playVideo();
        });
    }
    if (state == 1) {
        jQuery('#media-toggle-bottom').click(function (event) {
            player.pauseVideo();
        });
    } else {
        jQuery('#media-toggle-bottom').click(function (event) {
            player.playVideo();
        });
    }
    if (state == 1) {
        jQuery('.media-circle').click(function (event) {
            player.pauseVideo();
        });
    } else {
        jQuery('.media-circle').click(function (event) {
            player.playVideo();
        });
    }
}

我尝试使用innerHTML技术，但我无法更新字符串......有什么想法？

您要查看的当前网站：https://www.uncvrd.co

谢谢！

Answer 1

在这里回答我自己的问题，这就是我完成这个的方法：

document.getElementById("bottom-song-title").textContent = event.target.getVideoData().title;

希望这有助于某人！

使用YouTube Embed API更新包含视频标题的HTML文字

1 个答案: