MenusLesson 14Free preview
Search Menu
This lesson is part of How To · All levels
Summary
This lesson reviews the creation of a Navigation Menu with a Search Menu Filter using JavaScript. This feature allows users to type keywords in the search input box and the list of menu links below is directly filtered in real-time.
Key points
- Listening to the onkeyup event on the search input element
- Taking the input text value and converting it to uppercase for case-insensitive comparison
- Do iterations on all menu link elements and compare indexOf()
- Set style.display = '' if it fits, or 'none' if it doesn't fit
Full lesson
Code examples and quizzes
Full lessons, code examples, and quizzes are available to subscribers. 5 questions.