Take contentd from url and place in container on page

Question

Hi There,

I would like to use jQuery to find the last page name / directory from the url and display it on the page in a <h3> container. For example: /_blog/PunkLogic_News/tag/videos/ I would like to display 'videos' in a specific <h3 class="urltag"> on the page. /_blog/PunkLogic_News/tag/Noosa_Biosphere/ I would like to display 'Noosa Biosphere' without the underscore. I suppose all special characters would need to be removed as well.

Thanks in advance for your help.

Jackson

Answer 1

Have a look into the window.location object (documentation).

If you get the window.location.pathname parameter and perform some string manipulation (split, etc), you should be easily able to get the last 'part' of the url.

Have a look at the jQuery .text() method for inserting it into the <h3> element.

Answer 2

This should do it:

var title = location.href.match(/([^\/]*)\/?$/)[1]; //get the last token
title = title.replace(/[^a-z\d\s]+/ig, ' '); //remove non-alphanumeric characters
$('h3.urltag').text(title); //set the title to h3

Example: http://jsbin.com/ubiwo3