scrollIntoView

scrollIntoView is a method on DOM elements that scrolls the nearest scrollable ancestor so that the element becomes visible within its scrolling container or the viewport. It is commonly used to reveal a target item, such as a newly added element, an error region, or a focused section, without requiring manual scrolling from the user.

The method can be called with a boolean alignToTop parameter (legacy) or with an options object. The options form supports behavior, block, and inline. If options are provided, behavior can be 'auto' or 'smooth'; block controls vertical alignment with values such as 'start', 'center', 'end', or 'nearest'; inline controls horizontal alignment with the same set of values. If options are omitted, the default result is to align the element to the start of the scrollable area with automatic scrolling behavior.

scrollIntoView scrolls only the nearest scrollable ancestor; if the element has no such ancestor, the call has no effect. It does not guarantee full visibility of the element in all cases, and browsers may implement subtly different results based on container layout. It does not automatically focus the element; scrolling may be combined with element.focus() when keyboard accessibility is required.

Support is broad in modern browsers. In older environments, a polyfill or alternative scrolling logic may be used. A common usage is document.querySelector('#target').scrollIntoView({behavior: 'smooth', block: 'center'}).