Überprüfen Sie, ob das img src-Tag leer, null oder undefiniert ist

Question

Ich nehme JSON-Daten und verarbeite diese Daten, um sie in die richtigen HTML-Tags einzufügen. Manchmal enthalten JSON-Daten keine Informationen oder sind einfach nicht verfügbar. Im gegebenen Beispiel ist src leer oder der Kicker ist nicht vorhanden, was in dieser Zeile so etwas wie {} oder undefiniert oder '' oder null ergeben würde:

document.getElementById("placeholder_" + (k)).src = jsonData[i].src;

Ich habe auf der Tafel nach einer Lösung gesucht und es ausprobiert, jedoch ohne Erfolg. Oder vielleicht verstehe ich die Logik nicht. Einige Beispiele, die bei mir nicht funktioniert haben:

document.getElementById('id2').src = json.img2 ? json.img2.link : 'defaultLink';

Oder ich habe diesen Link nachgeschlagen:

JSON ist manchmal undefiniert – wie kann ich das überprüfen?

Dies ist mein Codeausschnitt. Ich möchte überprüfen, ob Daten (URL) in jsonData[i].src vorhanden sind. Wie kann ich das machen? Im zweiten Teil ist src leer und im dritten Teil fehlt der Kicker. Wie zu überprüfen?

var jsonData = [
    {
    src: 'https://www.w3schools.com/tags/img_girl.jpg',
    kicker: 'Kyiv',
    headline: 'Grief and defiance in city on first anniversary of war in Ukraine',
  },
  {
    src: '',
    kicker: 'Russia',
    headline: 'how can Ukraine win? And what is the feeling within Russia?',
  },
  {
    src: 'https://www.w3schools.com/tags/img_girl.jpg',
    
    headline: 'how can Ukraine win? And what is the feeling within Russia?',
  }
  ]
  
 $(document).ready(function () {
    var k = 1;
    //loop through json data and insert into corresponding divs
    for (var i = 0; i < jsonData.length; i++) {
        document.getElementById("placeholder_" + (k)).src = jsonData[i].src;
        document.getElementById("placeholder_" + (k = k + 1)).innerText = jsonData[i].kicker;
        document.getElementById("placeholder_" + (k = k + 1)).innerText = jsonData[i].headline;
        k = k + 1;
    }
    });

Answer 1

const imgElement = document.querySelector('img');
const imgSrc = imgElement.getAttribute('src');

if (!imgSrc || imgSrc.trim() === '') {
  console.log('Image src is empty, null or undefined');
} else {
  console.log('Image src is not empty');
}