Group first match only using regex

Question

I'm trying t match first occurrence only like this Let's say we have 2 divs :

<div>
  <span class="time">2016</span>
</div>
<div>
  <span class="time">2017</span>
  <span class="time">2018</span>
</div>

I want to get 2016 2017

Since second div has 2 it will get first one only and so on and here is an example to make it easier.

Example

https://regexr.com/3rma6

How to match first date only in this url ? What should I add to regex to do that Is that possible ?

Answer 1

Here's one for the schema in your link. It finds <div> , then skips all <span>|<dl>|<dt>|<\\span>|<\\dl>|<\\dt> , and then matches the first <dd> . It might not work if there are multi-line <span> . It may also break if any <div> is missing <dd> , but only if <dd> can exist outside of a <div> . It will also break if <span>, <dl>, or <dt> can have children. There is probably a fix for these issues, but it really depends on how badly you need it.

<\s*div\s+[^>]+>\s*(?:<\s*dt\s+[^>]+>\s*|<\s*dl\s+[^>]+>\s*|<\/\s*dl\s*>\s*|<\s*span\s*>[^<]+<\/\s*span\s*>\s*|<\/\s*dt\s*>\s*)+<\s*dd\s+class\s*=\s*"r-time"\s*>([^<]*)<\/\s*dd\s*>\s*

Answer 2

 let input = `<dt class="buyer-feedback"> <span>Всё как описывал продавец, доставка до города Калининграда долгая!</span> </dt> <dd class="r-time">21 Apr 2018 23:37</dd> </dl> <div class="f-additional-title" data-spm- anchor- id="0.0.0.i1.5dc4OM5cOM5coS">Additional Feedback </div> <dl class="buyer-additional- review"> <dt class="buyer-addition-feedback"></dt> <dd class="r-time" id="0.0.0.i4.5dc4OM5cOM5coS">22 Apr 2018 08:19 </dd> </dl> </div>`; let s = input.match(/(?<=<\\/dt>\\n*\\s*<dd.*>).*(?=\\s*\\n*<\\/dd>)/g); console.log(s); 

Try this

What this regex does is to check if it is preceded by the closing tag of dt followed by the element dd.

let input = `<dt class="buyer-feedback">

<span>Всё как описывал продавец,  доставка до 
города Калининграда долгая!</span>

</dt>

<dd class="r-time">21 Apr 2018 23:37</dd>
                </dl>

<div class="f-additional-title" data-spm- 
anchor- 
id="0.0.0.i1.5dc4OM5cOM5coS">Additional 
Feedback </div>
                <dl class="buyer-additional- 
review">

<dt class="buyer-addition-feedback"></dt>

<dd class="r-time" data-spm-anchor- 
id="0.0.0.i4.5dc4OM5cOM5coS">22 Apr 2018 
08:19</dd>
                </dl>

</div>`;
let s = input.match(/(?<=<\/dt>\n*\s*<dd.*>).*(?=<\/dd>)/g);

Output = ["21 Apr 2018 23:37", "22 Apr 2018 08:19"]

Answer 3

 $(document).ready(function(){ $('div').each(function(){ console.log($(this).children("span:first").text()) }) }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div> <span class="time">2016</span> </div> <div> <span class="time">2017</span> <span class="time">2018</span> </div> <div> <span class="time">2019</span> <span class="time">2020</span> </div> <div> <span class="time">2021</span> <span class="time">2022</span> </div> <div> <span class="time">2023</span> <span class="time">2024</span> <span class="time">2025</span> </div>