2016-09-20 10 views
0

私はスクリプトを持っており、スクリプトが貼り付けられたページから呼び出せるように関数を公開する必要があります。api関数呼び出しを受け取るラップスクリプト

たとえば、スクリプトがthescript.jsがある:今すぐ

console.log('The script has been loaded'); 

function doThisAPI() { 
    console.log('The API function has been called'); 
} 

、スクリプトが置かれているindex.htmlにあるようなもの:

<html> 
<head> 
</head> 
<body> 
    <script> 
     var s = document.createElement('script'); 
     s.async = true; 
     s.src = '//thescript.js'; 
     var s0 = document.getElementsByTagName('script')[0]; 
     s0.parentNode.insertBefore(s, s0); 

     doThisAPI(); 

    </script> 
</body> 
</html> 

ので、通常の状況下で、インデックス.htmlは「スクリプトが読み込まれました」と「API関数が呼び出されました」の両方のメッセージを表示します。

ただし、スクリプトの読み込みに時間がかかる場合は、doThisAPI()呼び出しで「Uncaught ReferenceError:doThisAPI is not defined」と表示されます。

スクリプトが完全に読み込まれた後にのみAPI関数が常に実行されるようにスクリプトをラップする方法はありますか?

答えて

1

スクリプトのロード時にeventlistenerを追加し、その関数からdoThisApiを呼び出します。

var s = document.createElement('script'); 
    s.async = true; 
    s.src = '//theScript.js'; 
    var s0 = document.getElementsByTagName('script')[0]; 

    s.addEventListener('load', function (e) { 
     doThisAPI(); 
    }, false); 

    s0.parentNode.insertBefore(s, s0); 
+0

これは問題なく機能します。どのようにs.addEventListener( 'load、function(e){'は' $ s.doThisAPI() 'のような変数に置き換えられるのですか? – Luciano

関連する問題