A brief discussion on progressive enhancement and smooth degradation of javascript_javascript skills

In the upper left corner of google.com.hk, there is a More link, which has a target address, but when we click on it, most of the time what we find is that a drop-down list pops up for the user to choose (this is a Typical form of progressive enhancement). How to understand? ——If the user's browser supports JavaScript, then you can enjoy this fast navigation service function.

Now, please disable the javascript function of your browser (click here will not disable it), visit google.com.hk again, and click More again, what happened? Yes, instead of seeing the dropdown, a new page opens. (This is a typical stationary degradation). How to understand? ——If the user's browser does not support JavaScript, the user can still access my website.

How to implement this function similar to google?

Copy code The code is as follows:

More»

Explanation: displayMenu() is a function that displays the navigation list (its implementation is omitted here, because this is not what is discussed)
onclick specifies the click event of the link.
return false: cancels the default behavior of the browser (so that displayMenu() is executed without page jump), this cannot be omitted (of course you can omit it and give it a try, it will help your understanding)

Now let’s see: if your browser supports javascript, then the code after onclick will definitely be executed. Otherwise, the code after onclick will not be executed, and the page will jump. In this way, users can access my website smoothly regardless of whether JavaScript is supported or not.

The following is another similar example. It opens a link in a new window, but we do not specify the target. If the user's browser does not support JavaScript, it will open the link in the current page, as follows:

Copy code The code is as follows:

 
• Baidu

 
• google