? ????? ? ??? ???? ??? ???? ?? ??? ???. ?, ? ?? ???? ???? ??? ???? ? ???? ?? ???? ???? ????? ?????. ? ????? ?? ??? ??? ????? ???? URL ??(#)? ???? ????? ??? ???? ?????. ??? ?? ??? ?? ??? ?? ???? ??? ???? ??? ??? ??? ??? ????? ? ??? ???.

??: ??? ?? ? ?? ?? ??? ??

?? ? ????????? ??? ??? ?? ?????. ???? ?? ??? ???? ??? ??? ??? ? ?? ???? ???? ??? ??? ? ???? ??? ? ???? ?? ??(?: ?? ??, ?? ?? ??? ?? ?? ?)?? ???? ????? ????. ???? ?? ??? ?? ? ??? ??? ? ?? ?? JavaScript ??? ????? ????? ????? ???? ???? ????.

?? ??? ?? ??

?? ????? ??????. ???? ???? ???? /TodoListDashboard ???? ???? ID? CommentSection? ??? ??????. ?????? ??? ?? ??? ??? ????.

HTML ??:

 <a class="sidebar-brand d-flex align-items-center justify-content-start">
   <div class="notification-bell" style="color:red">
   <i class="fas fa-fw fa-bell fa-2x" title="?? ?? ?? ?" onclick="'scrollToElement("CommentSection");'"></i>
   </div>
</a>

?????? ??:

 
    ?? scrollToElement(id) {
        // 1??: ??? ??? ?? window.location.replace("/TodoListDashboard");

        // 2??: ?? ??? offsetTop? ?????.
        // ??: ??? document.getElementById(id)? ?? ??? ???? ?????. var target = document.getElementById(id).offsetTop;

        // 3??: ?? ??? ??? window.scrollTo(0, target); 
    }

?? ??:

? ??? ???? window.location.replace("/TodoListDashboard");???. ? ?? ?? ???? ????? ?? ? ???/TodoListDashboard ??? ???? ?? ???? ?????. ?, ? ???? ???? ?? ?? ???? JavaScript ?? ??? ?????. ??? ??? ??? document.getElementById(id) ? window.scrollTo(0, target) ??? ??? ??? ?? ?? ???? ?????? ???? ????? ?????. ?? ?? ???? ?????? ??? ? ???? ?? ???? ?? ??? ??? ??? ???? ????. ? ????? ??? ??? ?? ????.

??? ???: URL ??(?? ???) ??

? ??? ???? ?? ?? ??? ?? ??? ?? ????? ??? URL? ??(#) ??? ???? ????. ????? ??? ??? URL(?: /page#section)? ???? ? ?? ?? ??? ?????.

1. ??? ???(/page)? ?????.
2. ???? ??? ? ????? ????? ID? ?? ?? ???? ??? ???? ?? ?? ??? ??? ??????.

? ????? ?????? ????? ???? ????? ??????.

???? HTML ??:

 <a class="sidebar-brand d-flex align-items-center justify-content-start">
   <div class="notification-bell" style="color:red">
   <i class="fas fa-fw fa-bell fa-2x" title="?? ?? ?? ?" onclick="'scrollToComments();'"></i>
   </div>
</a>

???? JavaScript ??:

 
    ?? ???ToComments() {
        // ??? ??? URL? ?? ?????.
        // ????? ID? "CommentSection"? ??? ??? ?? ? ???? ?????. window.location.replace("/TodoListDashboard#CommentSection");
    }

?? ??:

scrollToComments() ??? ???? window.location.replace("/TodoListDashboard#CommentSection"); ????? ??? ?????.

1. /TodoListDashboard ???? ?????.
2. /TodoListDashboard ???? ???? ????? ????? id="CommentSection"? HTML ??? ???? ????.
3. ??? ??? ????? ???? ??? ??? ?? ??? ??????.

??? ???? ??? ??? ??? ?? ?? ????? ? ?? ???? ??? ??? URL ??? ?? ???? ???? ??? JavaScript ?? ?? ?????? ????? ?????.

?? ?? ? ?? ??

1. ?? ?? ID? ???? ???. ?? ???(/TodoListDashboard)? id="CommentSection"? HTML ??? ??? ?????. ??? ??? ???? ????? ?????? ????.
2. window.location.replace() ? window.location.href:
   • window.location.replace()? ?? ??? ???? ????, ???? ?? ??? ???? ?? ???? ???? ????.
   • window.location.href = ... ?? location.sign(...)? ??? ? ??? ???? ???? ?? ??? ???? ??? ? ????. ??? ?? ??? ??? ??????. ? ???? ???? ?? ??? ???? ??? ???? ???? ??? ? ??? ??? ?? ??()? ?????.
3. ???? ???: ????? ?? ??? ??? ??????. ???? ??? ??? ??? ?? CSS? ??? ??? ??? ? ????. ??(html ?? ?? ??? ???) ?? JavaScript? element.scrollIntoView({behavior: 'smooth' }) ???? ?????(??? ????? ?? ????? ?? ???? ???? ???. URL ??? ???? ?? ????? ?? ???? ????? ??? ???? ?? ??? ??? ? ????).
4. ?? ? ??? ? ????? ? ???:
   • ?? ? ???(?: ASP.NET MVC)? ?? ??? ? ?? ???? ??? ID? ???? ??? ?????.
   • ????? ? ??? ?????(?: React Router, Vue Router, Angular Router)? ???? ?? ??? ??????(SPA)? ?? ??? ??????? ????? ?? ??? ? ??? ?? ????? ??? ?? ??? ?? ????? ?? ???? ???? ?? ?? API? ??? ? ????.
5. ???: ??? ??? ???? ???? ???? ?? ???? ?? ??? ???? ? ?? ??? ??? ?????.

??

URL? ??(?? ???) ??? ???? ?????? ?????? ????? ???? ???? ????? ????? ???? ???? ??? ??? ??? ? ?? ??? ??? ???? ??? ? ????. ? ?? ??? ?? JavaScript ??? ??? ??? ??? ??? ?? ????? ??? ??? ??????. ??? ??? ?? ??? ? ??? ???? ? URL ??? ??? ?? ?? ???? ??????.

? ??? ????? ??: ??? ??? ???? ???? ??? ?? ???? ????? ??? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!