Web navigation bar Click on the style after the jump

When building the navigation bar of a Web page, you need to click on a navigation page to jump, click on the <a> tag style to add or change (bootstrap can only achieve the page does not refresh the click Effect), online access to a lot, finally solved the problem, enlightened at the same time also small summary:

PS: The following is an excerpt Baidu know, not my original, and I use is one of the second method.

There are many methods, which can be broadly divided into three kinds:

First, in the server-side to determine the current page membership in which category, and then to highlight it, the method of highlighting is also a lot, I believe not you want, not one explanation;

Second, each page this navigation bar is in the respective page, then independently assigns to it the class or the inline style is also completely possible.

Thirdly, through JavaScript, after the navigation bar element is loaded, the URL is analyzed, or the other hidden flag bits placed in the page by the server are analyzed, and then highlighted.

Of the above three, the second is the most common, because most stations under each navigation category, the structure of the page is different, the use of independent navigation bar will not have any effect.

The first disadvantage is that the server needs to analyze the classification of this page, which consumes a certain amount of CPU resources.

The second disadvantage is that each category page has its own independent navigation bar, will occupy disk space (this is a bit too shouting truth)

The third disadvantage is that after the user opens the Web page, in the browser buffer stage, will not see the highlight, and so on after the page loaded or the navigation bar loading for a period of time, will become highlighted, there is a time delay.

Web navigation bar Click on the style after the jump