оператор if / else для поиска пустого iframe

Question

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

То, что я пытаюсь сделать, это иметь код, который найдет, если iframes src пуст, и вместо этого отобразит изображение. Я чувствую, что я довольно близко, но мне нужна помощь, чтобы заставить его работать.

HTML

<div class="col-sm-8 product-video-section">
            <iframe id="ytplayer" width="560" height="315" src="youtubelink" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen wmode="Opaque"></iframe>
            <img class="videoImg" style="display: none;" src="imgLink" />
        </div>

JS

if ($('.product-video-section iframe').contents().find("body").length == 0) {
        //alert("This is the IF");
    }
    else {
        //alert("this is the ELSE");
        $('.product-video-section iframe#ytplayer').remove();
        $('.product-video-section .videoImg').css('display', 'block');
    }

Может кто-нибудь помочь указать, где я ошибся?

Answer 1

Вы можете проверить атрибут источника iframe, используя attr

if (!$('iframe#empty').attr('src'))
{
    alert('empty');
}
    
if (!$('iframe#notempty').attr('src'))
{
   alert('empty too');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<iframe id="empty" src="">
</iframe>

<iframe id="notempty" src="www.stackoverflow.com">
</iframe>

Обратите внимание, что если существует более одного элемента, соответствующего вашему выбору, вам нужно будет выполнить итерацию каждого из них