How to call a JavaScript function when iframe finished loading?

Sometimes, we want to call a JavaScript function when iframe finished loading.

In this article, we’ll look at how to call a JavaScript function when iframe finished loading.

How to call a JavaScript function when iframe finished loading?

To call a JavaScript function when iframe finished loading, we can add an event listener for the load event.

For instance, we write:

<iframe src='https://example.com'></iframe>

to add an iframe.

Then we write:

const iframe = document.querySelector('iframe')
iframe.onload = () => {
  console.log('loaded')
}

to select the iframe with querySelector.

Then we set the iframe.onload property to a function that logs 'loaded'.

As a result, we see 'loaded' logged when the iframe is loaded.

Conclusion

To call a JavaScript function when iframe finished loading, we can add an event listener for the load event.