Design and implementation of e-commerce system (14): Menu highlighting

Source: Internet
Author: User

Menu highlighting is a feature that is required for almost all Web sites.

This function, said, is very simple, add a highlight to the menu of the current page, delete the other menu highlighting style.

If you only highlight 1 pages of the menu, it is too easy, but if the menu and page more, there is a controversy.

1th Way: Each page is highlighted individually.
<li id= "Indexli" ><a href= "${base}/" > Home </a></li>    <script type= "Text/javascript" > function Highlightindex () {Highlight ("Indexli");}      

    benefits : Flexibility is very strong.
    cons : Each page needs a way to add a highlight menu.

2nd way: by matching url,  to write only one highlight menu method.

Benefits : Menu highlighting logic processing, all in one place.
Cons : The flexibility is poor, the URL has more stringent requirements.
Simply put, the simpler the rules of the URL, the simpler the match. However, if there is an exception to the URL, it must be handled in a special case.
When you add another URL, consider whether the new URL and the existing URL match rule are conflicting.

I've used all 2 of these methods to talk about how I feel.
If the URL is more casual, the highlight function is called individually on each specific page.
If the URL is very uniform, it can be handled uniformly.

In the actual process, such as the company's project, about which way to create a dispute, the front-end want to be unified processing, the backend tends to be individually customized.
In the backend development process, URLs are more casual. The front end wants the backend to name the URL specification, according to the menu's organization to define the URL.
The boss is reluctant to do so, and he believes that menus and backend URLs do not need to be strictly unified, and that menus and back-end businesses should not have strong dependencies.

For our company projects and my own projects, I prefer to call the highlight function individually on each page, very flexible.
Some pages, only need to highlight the top-level menu, some pages, but also highlight the left side of the menu.

As for the logic of the highlighted menu, it can be encapsulated as a method.

No matter how many pages you add, the highlighting of each page will not affect each other.
Then spit a few words, packaging menu logic, each page called a highlight function, minutes to get things done. It is not possible to write a unified URL match, which takes an hour, and is not guaranteed to be completely correct, and URL matching cannot be reused across multiple projects.

Team development often has so many similar problems, resulting in very low development efficiency.

So, I think, an excellent all-stack development engineer, and 5 people small team development efficiency is similar.

Design and implementation of e-commerce system (14): Menu highlighting

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.