You have a couple of options to call a JavaScript function after a script is loaded:
1. Inline Script
Place the function call directly after the script tag in your HTML file. This ensures that the function is called immediately after the script is loaded.
```html
<script src="your_script.js"></script>
<script>
// Call your function here
yourFunction();
</script>
```
</code></pre>
<h3>2. Event Listener</h3>
<p>Use the <code>DOMContentLoaded</code> event or <code>load</code> event to call the function when the DOM content or the entire page is loaded, respectively.</p>
<pre><code>```html
<script src="your_script.js"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
// Call your function here
yourFunction();
});
</script>
```
</code></pre>
<h3>3. Async/Await with Promises</h3>
<p>If your script is loaded asynchronously, you can use async/await with promises to ensure that the function is called after the script is loaded.</p>
<pre><code>```html
<script>
async function loadScript(url) {
let script = document.createElement('script');
script.src = url;
await new Promise((resolve, reject) => {
script.onload = resolve;
script.onerror = reject;
document.head.appendChild(script);
});
}
async function callFunctionAfterScriptLoaded() {
await loadScript('your_script.js');
// Call your function here
yourFunction();
}
callFunctionAfterScriptLoaded();
</script>
```
Choose the method that best fits your use case and coding style.