With the following snippet:
let iframe = videoWrapper;
console.log(iframe);
Within video-player, I have the following child elements:

What is the best way to determine if <iframe> exists within that parent wrapper and check all levels of child elements?
<iframe> can be one or two levels within parent element, so it all depends.
Bonus points if I can determine if data-src exists within the iFrame.
I can't seem to track it at all - I have tried the following items:
let iframe = videoWrapper.parents().eq(2).find('iframe');
let iframe = videoWrapper.contents().find('iframe');
let iframe = videoWrapper.find('iframe');
let iframe = videoWrapper.find('iframe').length;
Nothing seems to have worked, all help will be appreciated!
I hope understand what you asked for correctly.
// check if exists
if ($('div.video-player iframe').length > 0) {
alert('frame exists');
}
// for finding child elements
let iframeMain = $("div.video-player iframe").contents().find('#something deeper than iframe main tag');
// then just go deeper
let iframe2ndLevelDeeper = $(iframeMain).contents().find('#something even more deeper inside iframe');
// check for data-src
let dataSrc = $('').attr('data-src');
const $iframe = document.querySelector(`iframe`);
$iframe.addEventListener("load", function () {
if (dataSrc !== '') {
console.log("loaded and exists");
} else {}
});