Why does this work? window.location.href

Question

Link example: http://localhost/test/page.php?success

I'm interested. And I'm also new to JavaScript, so this is not surprising, but I understand the code below, I just don't know why it works with what I seem to understand. See this question for more help.

I have this javascript:

<script type="text/javascript">
jQuery(function($) {
    var path = window.location.href.split( '?' )[0]; 
    $('ul a').each(function() { 
        if (this.href === path) {
            $(this).addClass('sub-menu active');
            $(this).parent().closest("li").addClass('active');
            $(this).parent().parent().closest("li").addClass('active');
        }
    });
}); 
</script>

Side panel:

<li class="sub-menu"> // Sidebar with no submenu
  <a class="" href="page1.php">
    <i class="icon-calendar"></i>
    <span>This is page 1</span>
  </a>
</li>
<li class="sub-menu"> // Sidebar with a submenu
  <a href="javascript:;" class="">
    <i class="icon-group"></i>
    <span>This has sub pages</span>
    <span class="arrow"></span>
  </a>
  <ul class="sub">
    <li><a class="" href="page2.php">This is page 2</a></li>
    <li><a class="" href="page3.php">This is page 3</a></li>
  </ul>
</li>

The code places the active class in a menu in the sidebar, which href is equal to the current URL. But it window.location.hrefreturns the whole url, but what's inside href is simple page.php. So why does it work this.href === path? When it window.location.href.split( '?' )[0]returns http://localhost/test/page.php, href is simple page.php.

Answer 1

The href binding property is normalized to an absolute value.

. : HTML:

<a href="test.html">Test</a>

JS:

var a = document.querySelector('a');
console.log(a.href);

Answer 2

URL- , . URL-.