CODEWITHSUNDEEP
jquery
leafcreative
leafcreative

Reputation: 51

Get part of a href path using jQuery

If i wanted to get the date (ex: 2016-12-21) from the href in a list how would you go about doing that? And then take that value and place it in the <li>

<ul id="xdesc" class="">

    <li class="">
      2016-12-21
       <div class="">
           <a class="hs-rss-title" href="http://domain.com/events/womens-event-2016-12-21?__hstc=233546881.1c39d8c7bec9e076de1b637bf5317294.1475698351504.1477050663648.1477054875380.25&amp;__hssc=233546881.1.1477054875380&amp;__hsfp=1945213963"><span>Event 2 Women's Event</span></a>
           </div>
        </li>



    <li class="hs-rss-item">
      2016-03-21
       <div class="hs-rss-item-text">
           <a class="hs-rss-title" href="http://domain.com/events/mens-event-2016-03-21?__hstc=233546881.1c39d8c7bec9e076de1b637bf5317294.1475698351504.1477050663648.1477054875380.25&amp;__hssc=233546881.1.1477054875380&amp;__hsfp=1945213963"><span>Event 1 Men's Event</span></a>

        </div>

    </li>

</ul>

Upvotes: 0

Views: 479

Answers (3)

Thanasis1101
Thanasis1101

Reputation: 1680

Oh, ok. Then you could use the .each() function alongside with .find() function.

$( "#xdesc li" ).each(function( index ) {
  mylink = $(this).find('div').find('a').attr('href'); 
  date = mylink.match(/[0-9]{4}[-][0-9]{2}[-][0-9]{2}/);
  $(this).text(date);
});

.each documentation: https://api.jquery.com/each/

.find documentation: https://api.jquery.com/find/

.text documentation: http://api.jquery.com/text/#text-text

I hope I helped this time :)

Upvotes: 0

Thanasis1101
Thanasis1101

Reputation: 1680

First of all you should add an id to the links in order to be able to access each of them from jquery:

<ul id="list">
  <li>
    <a id="link1" href="..."><span>Event 1</span></a>
  </li>
  <li>
    <a id="link2" href="..."><span>Event 2</span></a>
  </li>
</ul>

Then in jquery write this code:

// Get the href from link with id='link1'
var mylink = $("#link1").attr('href'); 

// Search the link for a pattern in this form YYYY-MM-DD
var date = mylink.match(/[0-9]{4}[-][0-9]{2}[-][0-9]{2}/);

// Now the variable date is equal to the date from the link,
// or to null if date was not found in link. You can test it with alert.    
alert(date);

On the code above regular expression is used to get the date from the link. If you want to learn more about regular expressions visit this link: http://www.w3schools.com/jsref/jsref_obj_regexp.asp

Stackoverflow questions I used in my research: get href attribute on jQuery, Javascript date regex DD/MM/YYYY

I hope this was helpful.

Upvotes: 1

vaso123
vaso123

Reputation: 12391

Assuming you have one date in your URL list in the format what you gave, you can use regex:

var pattern = /\d{4}-\d{2}-\d{2}/;
var string = "http://domain.com/event/name-event-2016-12-21?__hstc=233546881.1c...";
var result = string.match(pattern);

Output:

Array [ "2016-12-21" ]

Upvotes: 3

Related Questions