निष्पादित करने के लिए प्रतीक्षा करें, मैं अपने पृष्ठ में <script src="https://remote.com/"></script> तत्व इंजेक्ट कैसे कर सकता हूं, इसे निष्पादित करने के लिए प्रतीक्षा करें, और उसके बाद इसे परिभाषित करने वाले कार्यों का उपयोग करें?रिमोट src के साथ एक स्क्रिप्ट टैग इंजेक्ट करें और

एफवाईआई: मेरे मामले में, स्क्रिप्ट दुर्लभ मामलों में कुछ क्रेडिट कार्ड प्रसंस्करण करेगी, इसलिए मैं इसे हमेशा शामिल नहीं करना चाहता हूं। जब उपयोगकर्ता एक परिवर्तन-क्रेडिट-कार्ड-विकल्प संवाद खोलता है, तो मैं इसे तुरंत शामिल करना चाहता हूं, और उसके बाद इसे नया क्रेडिट कार्ड विकल्प भेजूं।

अतिरिक्त जानकारी के लिए संपादित करें: मुझे रिमोट स्क्रिप्ट तक पहुंच नहीं है।

2011-12-20 Riley Lark

क्या आपके पास रिमोट स्क्रिप्ट पर नियंत्रण है? यदि ऐसा है तो स्क्रिप्ट स्वयं अपना कोड कॉल होने पर कॉल करना आसान हो सकता है, ए-ला JSONP – hugomg

दुर्भाग्यवश मेरे पास रिमोट स्क्रिप्ट पर नियंत्रण नहीं है। यह देखने के लिए प्रश्न संपादित करना कि ~ –

आप गूगल एनालिटिक्स या फेसबुक की विधि का उपयोग कर सकते हैं:

(function(d, script) { 
    script = d.createElement('script'); 
    script.type = 'text/javascript'; 
    script.async = true; 
    script.onload = function(){ 
     // remote script has loaded 
    }; 
    script.src = 'http://www.google-analytics.com/ga.js'; 
    d.getElementsByTagName('head')[0].appendChild(script); 
}(document));

अद्यतन:

नीचे नई फेसबुक विधि है; यह <head> के बजाय एक मौजूदा स्क्रिप्ट टैग पर निर्भर करता है:

(function(d, s, id){ 
    var js, fjs = d.getElementsByTagName(s)[0]; 
    if (d.getElementById(id)){ return; } 
    js = d.createElement(s); js.id = id; 
    js.onload = function(){ 
     // remote script has loaded 
    }; 
    js.src = "//connect.facebook.net/en_US/sdk.js"; 
    fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk'));

अपने अद्वितीय स्क्रिप्ट पहचानकर्ता के साथ facebook-jssdk बदलें यह एक बार से अधिक संलग्न किया जा रहा से बचने के लिए।
स्क्रिप्ट के यूआरएल को अपने आप से बदलें।

स्रोत

2011-12-20 16:42:27 Pierre

यह सही लगता है, लेकिन इंटरनेट पर कुछ चापलूसी है कि सभी ब्राउज़रों द्वारा अधिभार नहीं कहा जाता है। क्या आप जानते हैं कि यह किस ब्राउजर के साथ काम करेगा? –

http://msdn.microsoft.com/en-us/library/hh180173(v=vs.85).aspx देखें। – Seth

आप इसे शरीर में क्यों नहीं जोड़ते? –

कुछ इस तरह चाल करना चाहिए:

(function() { 
    // Create a new script node 
    var script = document.createElement("script"); 
    script.type = "text/javascript"; 
    script.onload = function() { 
     // Cleanup onload handler 
     script.onload = null; 

     // do stuff with the loaded script! 

    } 

    // Add the script to the DOM 
    (document.getElementsByTagName("head")[ 0 ]).appendChild(script); 

    // Set the `src` to begin transport 
    script.src = "https://remote.com/"; 
})();

आशा व्यक्त की कि मदद करता है! खुश होती है।

स्रोत

2011-12-20 16:33:58 keeganwatkins

क्या कोई कारण है कि आपने कॉलबैक में स्क्रिप्ट ऑनलोड को मैन्युअल रूप से सेट किया है?क्या इसमें एक से अधिक बार ट्रिगर करने में कोई समस्या है, या यह सिर्फ कुछ प्रकार के कचरा संग्रह को मजबूर कर रहा है? –

हाँ, पुरानी आईई में मेमोरी लीक से बचने के लिए, स्क्रिप्ट तत्व के कारण ऑनलोड हैंडलर के रूप में फ़ंक्शन का संदर्भ देना। – keeganwatkins

एक ही विधि का उपयोग कर घटना श्रोताओं और ES2015 निर्माण करती है:

function injectScript(src) { 
    return new Promise((resolve, reject) => { 
     const script = document.createElement('script'); 
     script.async = true; 
     script.src = src; 
     script.addEventListener('load', resolve); 
     script.addEventListener('error',() => reject('Error loading script.')); 
     script.addEventListener('abort',() => reject('Script loading aborted.')); 
     document.head.appendChild(script); 
    }); 
} 

injectScript('http://example.com/script.js') 
    .then(() => { 
     console.log('Script loaded!'); 
    }).catch(error => { 
     console.log(error); 
    });

स्रोत

2016-08-18 02:02:52

यह एक तरीका है गतिशील रूप से लोड है और तालमेल के स्क्रिप्ट की एक सूची निष्पादित करने के लिए है। आप स्पष्ट रूप से गलत पर अपने async विशेषता सेटिंग डोम में प्रत्येक स्क्रिप्ट टैग डालने के लिए, की जरूरत है:

script.async = false;

जिन स्क्रिप्ट को डोम में इंजेक्ट कर दिया है एसिंक्रोनस रूप से डिफ़ॉल्ट रूप से क्रियान्वित कर रहे हैं, तो आप गलत पर async विशेषता सेट करने के लिए मैन्युअल रूप से इस के आसपास काम करने के लिए।

उदाहरण

<script> 
(function() { 
    var scriptNames = [ 
    "https://code.jquery.com/jquery.min.js", 
    "example.js" 
    ]; 
    for (var i = 0; i < scriptNames.length; i++) { 
    var script = document.createElement('script'); 
    script.src = scriptNames[i]; 
    script.async = false; // This is required for synchronous execution 
    document.head.appendChild(script); 
    } 
    // jquery.min.js and example.js will be run in order and synchronously 
})(); 
</script> 

<!-- Gotcha: these two script tags may still be run before `jquery.min.js` 
    and `example.js` --> 
<script src="example2.js"></script> 
<script>/* ... */<script>

संदर्भ

इस बारे में गूगल की जेक आर्चीबाल्ड द्वारा एक महान लेख है Deep dive into the murky waters of script loading कहा जाता है।
WHATWG spec on the tag टैग कैसे लोड किए जाते हैं इसका एक अच्छा और संपूर्ण विवरण है।

स्रोत

2017-07-11 10:55:20 Flimm

अब यह काम कर रहा है, ऊपर उठाया गया। बीटीडब्ल्यू, आखिरी समापन लिपि में बैकस्लैश गुम है। –

रिमोट src के साथ एक स्क्रिप्ट टैग इंजेक्ट करें और

उत्तर

उदाहरण

संदर्भ

संबंधित मुद्दे