jQuery addClass example
Change class name on click in jQuery
by H17737
HTML
<body>
<div class="resultsListContainer">
<article class="sideListItem" data-id="dp2i-immotalk_sergic-513892" data-in-highlighted-box="false">
<div class="sideListItemContainer">
<div class="sideListItemContainerInTableForListInResult">
<div class="manageAdsContainer condensedButtons">
</div>
<div class="sideListItemContainerTable">
<div class="sideListItemFirstBlock">
<div class="sideListInside">
<div class="notOnTheMarketLabel isOnMarket">
<span class="offTheMarketFromUser">
Cette annonce n’est plus disponible.
</span>
<span class="offTheMarketFromImport">
Cette annonce n’est pas publiée.
</span>
</div>
<div class="detailsContainer alreadySeen">
<div class="detailsContent adOverview changeStyleOnHover">
<div class="photo">
<a class="detailedSheetLink" href="/annonce/location/paris-15-e/appartement/2pieces/dp2i-immotalk_sergic-513892">
<img alt="Location appartement meublé 2 pièces 36 m²" class="searchItemPhoto" src="https://file.bienici.com/photo/dp2i-immotalk_sergic-513892_513892_1_101_M.JPG?width=300&height=180&fit=cover"/>
</a>
<div class="onPhotoDetails">
<div class="alreadySeenPicto" title="Annonce consultée">
<i class="md md-done">
</i>
</div>
...
JavaScript
var list = document.querySelectorAll('article');
var res = [];
for(var item of list) {
res.push({
link: `https://bienici.com${item.querySelector('.detailedSheetLink').getAttribute('href')}`,
img: item.querySelector('.searchItemPhoto').getAttribute('src').split('?')[0],
title: item.querySelector('.descriptionTitle').textContent.trim().split('\n').map(line => line.trim()).filter(line => !!line)[0],
address: item.querySelector('.descriptionTitle').textContent.trim().split('\n').map(line => line.trim()).filter(line => !!line)[1],
price: item.querySelector('.thePrice').textContent.trim(),
description: item.querySelector('.descriptionContent').textContent.trim().split('\n').map(line => line.trim()).filter(line => !!line).join('\n')
})
}
console.log(JSON.stringify(res, null, 2))