如何将此脚本转换为js文件？

我有这个脚本，我需要作为一个.js文件，所以我可以多次使用它，而无需在任何地方的脚本多个副本，如调用脚本YTiFramePlayer.js。但是，也许我想更改promoVideo或videoId。我会怎么做？如何将此脚本转换为js文件？

//YouTube iframe player 
//Load the iframe Player API 
var tag = document.createElement('script'); 

tag.src = "https://www.youtube.com/iframe_api"; 
var firstScriptTag = document.getElementsByTagName('script')[0]; 
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 

var player; 
function onYouTubeIframeAPIReady() { 
player = new YT.Player('promoVideo', { 
height: '390', 
width: '640', 
videoId: '00000', 
events: { 
     'onStateChange': onPlayerStateChange 
     } 
}); 
} 

function onPlayerStateChange(event) { 
if (event.data == YT.PlayerState.STOPPED) { 
stopVideo(); 
} 
} 

function startVideo() { 
$("#video").css("height", "calc(100vh - 48px)"); 
player.playVideo(); 
} 

function stopVideo() { 
player.stopVideo(); 
$("#video").css("height", "0px"); 
}

来源

2017-08-30 AwesomeTech10

它不是JS文件吗？ –

所以你有JavaScript代码，你需要它... JavaScript代码？究竟是什么问题？ – David

这不是一个JS文件。我想我可以让它成为.js，但是我如何使用videoid调用该播放器？ – AwesomeTech10

您可以将此保存为如前面提到的.js文件，但您可以访问其他地方的全局变量包装的功能。例如：

的script.js：

//YouTube iframe player 
//Load the iframe Player API 
var ytPlayer = (function() { 
    var tag = document.createElement('script'); 
    var videoId; 
    var promoVideo = 'promoVideo'; 
    var player; 

    tag.src = "https://www.youtube.com/iframe_api"; 
    var firstScriptTag = document.getElementsByTagName('script')[0]; 
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 

    return { 
    init(id, promoVideo) { 
     videoId = id; 
     promoVideo = promoVideo; 
     onYouTubeIframeAPIReady(); 
    } 
    } 

    function onYouTubeIframeAPIReady() { 
    console.log('Setting up:', videoId, promoVideo) 
    player = new YT.Player(promoVideo, { 
     height: '390', 
     width: '640', 
     videoId: videoId, 
     events: { 
     'onStateChange': onPlayerStateChange 
     } 
    }); 
    } 

    function onPlayerStateChange(event) { 
    if (event.data == YT.PlayerState.STOPPED) { 
     stopVideo(); 
    } 
    } 

    function startVideo() { 
    $("#video").css("height", "calc(100vh - 48px)"); 
    player.playVideo(); 
    } 

    function stopVideo() { 
    player.stopVideo(); 
    $("#video").css("height", "0px"); 
    } 
})();

HTML：

<!DOCTYPE html> 
<html> 

    <head> 
    <link rel="stylesheet" href="style.css"> 
    <script src="script.js"></script> 
    </head> 

    <body> 
    <h1>Hello Plunker!</h1> 
    <script> 
     ytPlayer.init('a8a83sda', 'someOtherId') 
    </script> 
    </body> 

</html>

更多信息，请参见revealing module pattern。

来源

2017-08-30 19:00:57 Phix

谢谢！ +1 +1 – AwesomeTech10

ytPlayer.init（'a8a83sda'，'someOtherId'） - 什么是a8a83sda？什么是其他ID？ – AwesomeTech10

@ AwesomeTech10它们是promoVideo id（'promoVideo'）的videoId。你可以通过任何你需要的。 init函数在js中定义：'init（id，promoVideo）' – ivo

只是保存为filename.js扩展

来源

2017-08-30 18:54:44 Bhautik

如何将此脚本转换为js文件？

回答

相关问题