Javascript to scroll to element with ID after event

JavaScript
1

I’ve got a script that scrolls the page to the top when a form in an iframe has submitted and new content loads into the iframe.

document.querySelector("iframe").addEventListener("load", 
function() {
    window.scrollTo({
top: 0,
left: 0,
behavior: 'smooth'
});
});

Instead of scrolling to the top I need the page to scroll to a particular element with a specific ID. How would that code need to change?

I’m not very knowledgable with JS, so would really appreciate the full code needed. Thank you so much!

2

Is the new content which loads into the iframe.a new HTML document?

3

Thank you for your reply, @snadyleiby

Yes, a new document loads.

4

Lets assume that the new HTML document is named newpage.html
and inside it there is an element that contains the attribute id=“foo”.

Then there is actually no need for JavaScript.

In the code for your form’s submiission, just change newpage.html to
newpage.html#foo

1 Like