Je travaille sur un site Web WordPress / PHP dans lequel je souhaite ajouter une classe lorsqu'il n'y a pas de contenu dans les classes de l'enfant.
formaté HTML: P>
jQuery(function($) {
if ($(".featured-block__title").is(":empty") && $(".featured-block__tag").is(":empty")) {
$(".img-fit").addClass("opacity-pointseven");
}
})
3 Réponses :
pas de jQuery nécessaire.
if (
document.querySelector('.featured-block__title > *').length === 0 &&
document.querySelector('.featured-block__tag > *').length === 0
) {
// add class here
}
Merci d'avoir répondu. Il ne semble pas fonctionner comme la classe que je veux ajouter est d'être ajoutée partout.
Ensuite, vous avez besoin de plus de sélecteurs spécifiques.
.img-ajustement est utilisé partout dans le document HTML. Y a-t-il un moyen que nous ne puissions cibler que spécifiques img-ajustement ?
Ah je vois ce que tu demandes. Une minute.
Je pense que votre exemple est éteint. Où vous avez votre commentaire sur l'endroit où la classe devrait aller, cette div a du contenu. Élément img vide.
// Pas de contenu
// Pas de contenu Il n'a pas de contenu, donc l'endroit où J'ai ajouté un commentaire (
// il doit être ajouté ici uniquement ) doit avoir ajouté la classe lorsque la page sera chargée.
Je pense que je n'ai pas expliqué la question correctement.
Laissez-nous Continuez cette discussion en chat .
Bon après-midi, vous pouvez être la façon dont vous essayez de tester s'il est vide. Essayez ceci: amusez-vous!
En essayant. Restez à l'écoute.
Vous devez faire boucler sur l'élément parent et seulement la requête dans cet élément. Comme il se trouve, chacune de vos questions est appliquée à l'ensemble du document.
Vous voulez probablement utiliser la méthode p> chacune () code> pour boucler sur les sections et seule la requête dans la section en utilisant le Ce paramètre code>. Quelque chose comme ceci: p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="featured-block">
<a href="/" class="featured-block__item cf">
<div class="featured-block__item-inner">
<figure class="featured-block__image img-fit">
<img class="default-opacity" src="" data-fallback-img="" alt="">
</figure>
</div>
</a>
<a href="/" class="featured-block__item cf">
<div class="featured-block__item-inner">
<figure class="featured-block__image img-fit">
<img class="default-opacity" src="" data-fallback-img="" alt="">
</figure>
</div>
</a>
<!-- -->
<a href="/149553/" class="featured-block__item cf">
<div class="featured-block__item-inner">
<figure class="featured-block__image img-fit"> // It should be added here only
<img src="" srcset="">
</figure>
<div class="featured-block__content">
<h1 style="margin-bottom:0px;" class="featured-block__title"></h1>
// No content
<h1 class="featured-block__tag"></h1>
// No content
</div>
</div>
</a>
<a href="/" class="featured-block__item cf">
<div class="featured-block__item-inner">
<figure class="featured-block__image img-fit">
<img src=""
</figure>
<div class="featured-block__content">
<h1 style="margin-bottom:0px;" class="featured-block__title">Trans Mountain Pipeline: NEB Releases New Report, Recommends Approval </h1>
<h1 class="featured-block__tag"> More Coverage</h1>
</div>
</div>
</a>
</div>
Disons que si je veux ajouter la classe à l'intérieur de la balise IMG. Puis-je utiliser quelque chose comme celui-ci $ (this) .Find (". Img-ajustement img"). AddClass ("Opacity-Pointeven");
La balise img est sous le
Cette ligne
C'est vrai - si vous vouliez ajouter la classe à la balise IMG elle-même, vous utiliseriez $ (this) .Find (". IMG-FIT IMG"). AddClass ("Opacity-Pointven")
En outre, si nous voulons le style $ (ceci) .Find (". IMG-FIT img"). Style.Opacity = "0.7! IMPORTANT"; Pouvons-nous utiliser comme ça? Est-ce correct ?
Ceci est en dehors de la portée de votre question initiale, mais la manière habituelle d'appliquer des styles dans JQuery est d'utiliser l'assistant CSS . API.JQUERY.com/CSS/#CSS-PROPERTYNAME-VALUE
Vous devez utiliser un
$ ('. Theclass'). Chaque () boucle. Dans la fonction, vous pouvez utiliser$ (this) pour se référer à l'élément actuel.Comme ceci: jsfiddle.net/khrismuc/0356bnd2
@Chris G Ceci semble bon, merci pour l'aide mais laissez-vous dire si je veux ajouter la classe à l'intérieur de la balise IMG. Puis-je utiliser quelque chose comme celui-ci
$ (this) .Find (". Img-ajustement img"). AddClass ("Opacity-Pointeven");La balise img est sous le ligne
Cette ligne![]()
Oui, cela devrait fonctionner comme.