Home/ Questions/Q 7966303
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-04T06:23:17+00:00

I have a JQuery function that grabs the URL path and adds it as

  • 0

I have a JQuery function that grabs the URL path and adds it as a body class as such:

var pathname = window.location.pathname;
var pathSlashesReplaced = pathname.replace(/\//g, " ");
var pathSlashesReplacedNoFirstDash = pathSlashesReplaced.replace(" ","");
var newClass = pathSlashesReplacedNoFirstDash.replace(/\(\d*\)/g, '').replace(/\s/, '-');

    $("body").addClass(newClass);
    if ( $("body").attr("class") == "") 
    {   

        $("body").addClass("class");

    }

.. so if the url is something like /myapp/user/list, the body class ends up as:

<body class="myapp-user list">

The issue is I would like to have all three words with dashes so it should be:

<body class="myapp-user-list">

.. and then I can theme using the CSS:

.myapp-user-list {

}

I am pretty sure there is an issue with my RegEx but I cannot figure out where. I tried various text functions but then the problem was that it grabbed all the text from the page and put that in as the body class:

var text = $(this).text();
var newClass  = $.trim(text.replace(/\(\d*\)/g, '').toLowerCase()).replace(/\s/, '-');
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Try :

    var newClass = location.pathname.split('/').join('-').replace(/(^-|-$)/g,''),
    $body = $("body").addClass(newClass);

if ($body.attr("class") == "") {   
    $body.addClass("class");
}

    I would avoid the class name class. It could give problems.

    • 0