Excluding text contents from Ctrl+F search in the browser
How to make Ctrl+F search disregard matches in specified container elements
Recently inert
attribute has been added to the HTML specification. The contents of inert elements cannot be selected or clicked. First it was not the case, but now the browser ignores the text contents within inert elements while searching for matches to the expressions entered into the Ctrl+F search box (officially referred to as the find-in-page feature).
When I posted this article a year ago, the inert
attribute did not prevent the find-in-page from searching inside the element. But now the situation has changed.
Why hide text from Ctrl+F?
In web applications contents of some tiny element, a table row or a label in a form, are expanded or detailed in a popup upon a click. If users launch the find-in-page when a popup is opened, it is always because they want to search specifically inside the contents of the popup and not elsewhere in the page.
For example, a sample web page contains a table with descriptions of HTML tags. The descriptions are too big to fit into a one-row cell. But when a cell with a truncated description is clicked, the entire description is shown in the popup. Then the user might…