I asked Bard AI about why iframes don’t update the src attribute when the content changes, and got a very logical response.
Thinking about it, one obvious point is that the content within the iframe should not leak any data in the page. This is because in the iframe, the content may include something like an OAuth login, or query state. It is possible that the query parameters could contain something like an OAuth code or sensitive search queries, which should definitely not be shared with the parent DOM.
The full response is below.
There are a few reasons why the iframe element’s
src attribute does not change when the URL of an iframe is changed within the iframe.
First, it is important to remember that an iframe is a separate document from the parent document. When you change the URL of an iframe within the iframe, you are actually changing the URL of the embedded document, not the iframe element itself.
src attribute of an iframe element is read-only. This means that once the
src attribute is set, it cannot be changed.
Finally, there is a security risk associated with allowing iframes to change their own
src attribute. If an iframe were able to change its own
src attribute, it could potentially load malicious content from a different domain.
src attribute of the iframe element.
// Get the iframe element
var iframe = document.getElementById('myIframe');
// Set the src attribute of the iframe element
iframe.src = 'https://new-url.com';
When you set the
It is important to note that you can only change the URL of an iframe if the iframe is from the same domain as the parent document. If the iframe is from a different domain, you will need to use a cross-origin resource sharing (CORS) request to change the URL of the iframe.