JS IIFE 破坏 YouTube 跟踪

Question

我很困惑为什么将我的 YouTube 跟踪代码放入 IIFE 后它会停止工作。

我的理解是 IIFE 运行是即时的，那么为什么只包含纯 js 的脚本与包含 IFEE 的脚本之间存在差异？

这是我的纯 JS，可以正常工作：

if ( 0 < ga_options.youtube.length ) {
    var tag = document.createElement( 'script' );
    tag.src = '//www.youtube.com/iframe_api';
    var firstScriptTag = document.getElementsByTagName( 'script' )[0];
    firstScriptTag.parentNode.insertBefore( tag, firstScriptTag );

    function onYouTubeIframeAPIReady() {
        scroll_events.register_youtube_videos();
    }
}

但是，当我将它包装在 IIFE 中时，如下所示，它不再有效（没有触发跟踪事件）。我正在尝试使用 IIFE 作为将现有代码重组为独立单元的一部分。

有人能解释一下我做错了什么吗？我已经考虑过范围并尝试在 IIFE 之外使用 var tag 和 var firstScriptTag，但仍然没有成功。

gaEventsVideoTracking = (function(){

    window.console.log( "why no youtube tracking?" );
        if ( 0 < ga_options.youtube.length ) {
            tag = document.createElement( 'script' );
            tag.src = '//www.youtube.com/iframe_api';
            firstScriptTag = document.getElementsByTagName( 'script' )[0];
            firstScriptTag.parentNode.insertBefore( tag, firstScriptTag );

            function onYouTubeIframeAPIReady() {
                scroll_events.register_youtube_videos();
            }
        }
})();

Answer 1

函数 onYouTubeIframeAPIReady 由从 YouTube 服务器加载的脚本调用。

由于您使用函数声明来定义它，因此它局部作用域为 IIFE。这意味着它不是全局的，因此无法供 YouTube 脚本调用。

您可以明确地使其成为全局的。

在第一行添加var onYouTubeIframeAPIReady;（在 IIFE之外），然后将onYouTubeIframeAPIReady =放在函数声明的前面，使其成为函数表达式和将其分配给全局变量。

JS IIFE 破坏 YouTube 跟踪

JS IIFE breaks YouTube Tracking

javascript

iife

event-tracking