Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
    <script>
    var xmlhttp = new XMLHttpRequest();
    var url = "https://www.googleapis.com/youtube/v3/playlistItems?part=snippet,contentDetails&playlistId=播放清單序號&key=你自己的憑證金鑰&maxResults=50";
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            var myArr = JSON.parse(xmlhttp.responseText);
            myFunction(myArr);
        }
    }
    xmlhttp.open("GET", url, true);
    xmlhttp.send();
    function myFunction(arr) {
        var data = arr.items;
        var out = "";
        var i;
        for (i = 0; i < data.length; i++) {
            out += '<img src="' + data[i].snippet.thumbnails.medium.url + '" />';
            out += '<p><a href="https://youtu.be/' + data[i].snippet.resourceId.videoId + '" target="_blank">' + data[i].snippet.title + '</a></p>';
            out += '<p> </p>';
        }
        document.getElementById("youtube-playlist").innerHTML = out;
    }
    </script>
</head>
<body>
    <div id="youtube-playlist">
    </div>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers