Блог

У меня есть следующая структура HTML в моей СТРУКТУРЕ HTML документа

[! [введите описание изображения здесь][1]][1]

Мне нужно захватить info__meta-dates текст, чтобы указать только дату, используя onClick событие в jQuery, это код, который у меня есть до сих пор:

  $("input[type=checkbox]").click(function (e) {
       
            $(this)
                .parent()
                .parent()
                .parent()
                .find(".info__meta--dates")
                .text()
         );
});
 

Но я также получаю date текст, который находится внутри вложенного диапазона.

Вы можете clone использовать этот тег span и использовать .remove() remove mdc-typography--caption из клонированного элемента, чтобы конечным результатом был только тот текст, который вам нужен

Демонстрационный код :

 $("input[type=checkbox]").click(function(e) {
  var texts = $(this).closest(".ev-info_meta").find(".info__meta--dates").clone(); //clone that span tag
  texts.find('span.mdc-typography--caption').remove(); //remove elemnt with class mdc-typography--caption
  console.log(texts.text().trim()); //show 
}); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="ev-info_meta">
  <span class="info__meta--dates"><span class="mdc-typography--caption">dates</span> fffff</span>
  <div>
    <input type="checkbox">
  </div>
</div> 

Поскольку прямого элемента для получения даты нет, вы можете попробовать описанный выше метод, описанный Swati, и если вы не хотите удалять элемент из DOM, попробуйте метод обработки строк.

Приведенный ниже метод работает только для этого сценария.

 $("input[type=checkbox]").click(function (e) {
       
         let dateString =  $(this).parent()
                .parent()
                .parent()
                .find(".info__meta--dates")
                .text()
         );
       //removing the "date" string from the entire string
       let date = dateString.substring(4,dateString.length).trim();
       console.log(date);
});