How to change my page in web such as dashboard?

I'd like to change only body not all including nav, sidebar in html file when I click the menu in sidebar.

for example, when I click the Coding Convention menu in sidebar, It must be changed from index.html to test.html. And index.html includes nav, sidebar but test.html not. So there is ViewPager or frame in Android, I want to develop this function in web.

This is my web sample image:

This question is too general and you might want to provide a bit more information such as is your site a static web site or dynamic web site? is there a backend server running? are you using any web libs for HTML rendering?

Without knowing details, it is bit hard to give you a good direction. But usually there are few different approaches for dynamic html rendering: 1. build a single page web app using angularJS or reactJS or other libs; 2. use JQuery to launch Ajax request to fetch content from backend server; 3. if you don't have a server and you are building a static web with just a couple of static html pages, use html include and then use javascript to control hide/show;

There are many other ways of dynamically changing HTML snippets. What would be the best for you is depending on your project itself.