Does loading a NavBar with a jQuery .load function, allow that NavBar content to be “seen” by search engine crawlers?

Question

I have a conceptual question about using jQuery to load a NavBar on all pages of a small website I have.

On this below stackoverflow page, user Ramtin shows how I could use jQuery to load a NavBar with a .load() function:

https://stackoverflow.com/questions/31954089/html-css-navigation-bar-on-multiple-pages

<!--Navigation bar-->
<div id="nav-placeholder">

</div>

<script>
$(function(){
  $("#nav-placeholder").load("nav.html");
});
</script>
<!--end of Navigation bar-->

Currently, on my small website, the navbar code for every page is literally hardcoded into every .htm page, so whenever a navbar change needs to be made, we have to do a find and replace for all files, which is of course clunky.

However, if I do the method described above, to "centralize" the navbar in a file and load it via the jQuery method described above, will that NavBar content be "seen" by Google's search engine crawlers as it the crawlers try to determine what content is on the webpage, or will the search engine crawlers just see the .load("nav.html") call and not be able to process the actual NavBar content? Perhaps another way to phrase this is: will using this .load method negatively affect SEO?

I was able to find this question which is similar to what I'm asking:

https://stackoverflow.com/questions/2074955/would-using-jquery-to-load-elements-affect-seo-ranking

However, that question is nearly 10 years old at this point. That lone answer seems to indicate that what I'm describing would negatively affect SEO, but I'm wondering if things have changed in the last decade or so that the search engines are perhaps smart enough nowadays that they could "see" the navbar content if used the jQuery .load function in this way.

Answer 1

Google's crawler has changed a lot in the last 10 years. Now it evaluates JavaScript and indexes the final, fully-loaded page, so the loading pattern in your example would not negatively affect SEO with Google. Google uses a modified version of Chrome 41 to render web pages, so it supports most of the features that Chrome 41 supports.

To be sure your page is rendering properly, you may want to check how Google is rendering your page by using Google Search Console.

Of note is that this loading pattern may negatively affect SEO with search engines other than Google that do not execute JavaScript.