>  기사  >  백엔드 개발  >  javascript - 현재 페이지의 탐색 링크를 올바르게 강조 표시하는 방법은 무엇입니까?

javascript - 현재 페이지의 탐색 링크를 올바르게 강조 표시하는 방법은 무엇입니까?

WBOY
WBOY원래의
2016-10-17 09:30:161440검색

javascript - 현재 페이지의 탐색 링크를 올바르게 강조 표시하는 방법은 무엇입니까?
javascript - 현재 페이지의 탐색 링크를 올바르게 강조 표시하는 방법은 무엇입니까?
위와 같은 웹사이트 탐색의 경우 링크를 클릭하면 라벨이 강조 표시되고, 다른 페이지를 클릭하면 해당 페이지로 이동합니다. , 현재 페이지에 해당하는 탐색 태그도 강조 표시됩니다. 일반적인 디자인 계획은 무엇입니까? 훌륭하고 우아한 솔루션은 무엇입니까? 답변을 요청하세요.
제가 개인적으로 생각한 해결책은 다음과 같습니다.
1. 창이 로드될 때 이 태그의 URL을 탐색합니다. 현재 페이지의 웹페이지 URL과 동일하면 강조 표시합니다.
2. 현재 클릭한 탐색 색인을 저장하고, 현재 페이지에 진입한 후 색인 값을 읽고, 색인 값이 표시된 라벨을 강조 표시합니다.

이 두 가지 방법은 다소 신뢰성이 없다고 느껴서 더 나은 아이디어를 찾고 있습니다.

답글 내용:

javascript - 현재 페이지의 탐색 링크를 올바르게 강조 표시하는 방법은 무엇입니까?
javascript - 현재 페이지의 탐색 링크를 올바르게 강조 표시하는 방법은 무엇입니까?위와 같은 웹사이트 탐색의 경우 링크를 클릭하면 라벨이 강조 표시되고, 다른 페이지를 클릭하면 해당 페이지로 이동합니다. , 현재 페이지에 해당하는 탐색 태그도 강조 표시됩니다. 일반적인 디자인 계획은 무엇입니까? 훌륭하고 우아한 솔루션은 무엇입니까? 답변을 요청하세요.
제가 개인적으로 생각한 해결책은 다음과 같습니다.
1. 창이 로드될 때 이 태그의 URL을 탐색합니다. 현재 페이지의 웹페이지 URL과 동일하면 강조 표시합니다.
2. 현재 클릭한 탐색 색인을 저장하고, 현재 페이지에 진입한 후 색인 값을 읽고, 색인 값이 표시된 라벨을 강조 표시합니다.
이 두 가지 방법은 좀 신빙성이 없다고 느껴져서 더 나은 아이디어를 요청드리고 싶습니다.

자바스크립트

a 요소의

속성이 페이지 URL과 동일한 것으로 판단 가능

href

과 같은 각 요소에 사용자 정의 데이터 속성을 추가하고 그 안에 일반 일치 항목을 넣을 수도 있습니다.

JSFiddle: https://jsfiddle.net/bd4g5f2h/data-pattern

이런 건 웹페이지가 3~5개 정도 밖에 안 되는 것 같아요. 강조 표시된 클래스를 만듭니다. 그런 다음 각 페이지에 대해 강조 표시된 탐색을 설정하십시오. 템플릿 엔진을 사용하는 경우. 이 단계는 템플릿 엔진을 사용하여 수행할 수 있습니다. 단일 페이지 애플리케이션을 사용하는 경우 이 경우에만 js 사용을 고려하거나 #

이후를 판단하세요.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.