Vérifiez si un SRC IMG est vide en utilisant JavaScript

Vérifiez si un SRC IMG est vide en utilisant JavaScript
Lors de la conception d'une page ou d'un site Web attrayante, certaines images et effets peuvent être appliqués pour faire ressortir un site Web. Dans un tel cas, le processus de vérification si les images sont incluses dans une page Web ou non devient manuellement difficile et prend du temps. Cependant, vous pouvez utiliser JavaScript dans une telle situation pour répondre aux exigences données et gagner du temps efficacement.

Cet article montrera les approches pour vérifier si un SRC IMG est vide en javascript

Comment vérifier si un SRC IMG est vide en utilisant JavaScript?

Pour vérifier si un SRC IMG est vide en utilisant JavaScript, les approches suivantes en combinaison avec le «getAttribute ()«La méthode peut être utilisée:

  • "opérateur logique (!)".
  • "nul" Type de données.

Discutons de chacune des approches une par une!

Approche 1: Vérifiez si un SRC IMG est vide en JavaScript à l'aide de l'opérateur logique (!)

Le "getAttribute ()«La méthode donne la valeur de l'attribut d'un élément. Tandis que les opérateurs «logiques» sont utilisés pour analyser la logique entre les variables ou les valeurs. Plus précisément, le «Logical Not (!) »L'opérateur peut être utilisé pour vérifier si un attribut particulier est inclus ou vide dans un élément.

Syntaxe

élément.getAttribute (nom)

Dans la syntaxe donnée:

  • "nom»Fait référence au nom de l'attribut.

Exemple 1: Vérifiez un seul attribut SRC dans une image
Dans cet exemple, un attribut spécifique, je.e., SRC, sera vérifié pour l'exigence indiquée:


Dans les lignes de code ci-dessus:

  • Premièrement, spécifiez le «"Élément ayant le déclaré"identifiant".
  • Dans le code JS, accédez à l'élément d'image spécifié par son «identifiant" en utilisant le "getElementByid ()" méthode.
  • Dans l'étape suivante, appliquez le «getAttribute ()"Méthode spécifiant l'attribut"SRC«Comme paramètre, qui sera vérifié pour l'exigence indiquée.
  • Après cela, appliquez le «sinon«Condition telle que l'ancienne déclaration spécifiée dans le«si»La condition est affichée sur le«SRC”L'attribut étant vide dans l'image récupérée.
  • Dans l'autre scénario, le «autre»La condition sera exécutée.

Sortir

Dans la sortie ci-dessus, on peut observer que le «SRC»L'attribut dans l'image est vide.

Exemple 2: Vérifiez plusieurs attributs SRC dans les images
Dans cet exemple, deux images ayant un vide et non vide "SRC»Les attributs seront vérifiés:






Appliquez les étapes suivantes dans l'extrait de code ci-dessus:

  • Premièrement, spécifiez le «"Élément ayant le déclaré"identifiant"Comme son attribut.
  • De même, incluez un autre "”Élément ayant le"SRC" et "identifiant»Attributs, respectivement.
  • Dans le code JavaScript, l'accès a inclus des images par leur «identifiant" dans le "getElementByid ()" méthode.
  • Après cela, appliquez le «getAttribute ()«Méthode sur chacune des images récupérées pour localiser le«SRC" attribut.
  • Maintenant, appliquez la condition pour vérifier que si le «SRC«L'attribut n'est pas contenu dans les deux images, l'ancienne déclaration est affichée à l'aide du«&&»Opérateur.
  • Dans l'autre scénario, le «autre»La condition exécute.

Sortir

On peut voir que le «SRC«L'attribut dans les deux images n'est pas vide comme spécifié par le message sur la console.

Approche 2: Vérifiez si un SRC dans un IMG est vide en JavaScript en utilisant un type de données nul.

Le "nul»Le type de données indique une valeur nulle. Ce type de données peut être utilisé en combinaison avec le «getAttribute ()"Méthode et le"égalité (==)»Opérateur pour vérifier l'exigence indiquée en allouant la valeur nul au«SRC»Attribue et la vérification.

Exemple
L'exemple suivant illustre le concept déclaré:


Maintenant, implémentez les étapes suivantes dans l'extrait de code ci-dessus:

  • Rappelez-vous les approches discutées pour inclure le ««Élément et le récupérer via le«getElementByid ()" méthode.
  • Après cela, de même, accédez au «SRC«Attribut de l'image récupérée en utilisant le«getAttribute ()" méthode.
  • Dans l'étape suivante, vérifiez si l'attribut SRC dans l'image est vide à l'aide du «nul" valeur.
  • Dans le cas où la condition ajoutée est satisfaite, le code ajouté dans le «si»Le bloc sera exécuté. Dans l'autre scénario, de même, le «autre»La condition entrera en vigueur.

Sortir

La sortie ci-dessus signifie que l'exigence indiquée est remplie.

Conclusion

Le "getAttribute ()«Méthode en combinaison avec le«logique»Opérateur (!) ou la "nul»Le type de données peut être utilisé pour vérifier si un SRC IMG est vide en javascript. L'ancienne approche peut être mise en œuvre pour vérifier le «SRC»Attribut directement sur des images uniques et multiples. Cette dernière approche peut être appliquée pour effectuer l'exigence souhaitée en attribuant un «nul”Valeur à l'attribut récupéré et le confirmant. Ce blog explique comment vérifier si un SRC dans un IMG est vide en utilisant JavaScript.