Javascriptで、オブジェクト(?)の中身を取得するには?

Question

JSでオブジェクトの中身を取得したい

lightbox系のプラグインで、fancybox3というプラグインがあり、それをサイトで利用しています。
https://fancyapps.com/fancybox/3/docs/
type:iframeのslideを作り、そのiframeにYouTube動画を差し込んで、いろいろ操作したいのですが、
iframeのidが取得できなくて困っています。

中身をconsoleに表示してみましたが、この中の、「id」を取得するには、どうしたら良いのでしょうか。
かなり初歩的なことだと思うのですが。。。。

※上記画像は、「← ← ← コレ」で表示したものになります。

jQuery.fancybox.open({
	type: "iframe",
	opts: {
		smallBtn: false,
		animationEffect: false,
		width: '100%',
		height: '100%',
		baseTpl:
			'<div class="fancybox-container" role="dialog" tabindex="-1">' +
			'<div class="fancybox-bg" style="opacity:1;background-color:rgba(0,0,0,.97);"></div>' +
			'<div class="fancybox-inner">' +
			'<div class="fancybox-toolbar">{{buttons}}</div>' +
			'<div class="fancybox-stage"></div>' +
			"</div>" +
			"</div>",
		touch: {
			vertical: false,
			momentum: false
		},
		beforeLoad: function(instance,current){
			console.info( current ) //← ← ← コレ
			var tag = document.createElement('script');

			tag.src = "https://www.youtube.com/iframe_api";
			var firstScriptTag = document.getElementsByTagName('script')[0];
			firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

			// 3. This function creates an <iframe> (and YouTube player)
			//    after the API code downloads.
			var player;
			function onYouTubeIframeAPIReady() {
				player = new YT.Player(id_name, {
					height: '360',
					width: '640',
					videoId: 'XXXXXXXXX',
					events: {
						'onReady': onPlayerReady,
						'onStateChange': onPlayerStateChange
					}
				});
			}

			// 4. The API will call this function when the video player is ready.
			function onPlayerReady(event) {
				event.target.playVideo();
			}

			// 5. The API calls this function when the player's state changes.
			//    The function indicates that when playing a video (state=1),
			//    the player should play for six seconds and then stop.
			var done = false;
			function onPlayerStateChange(event) {
				if (event.data == YT.PlayerState.PLAYING && !done) {
					setTimeout(stopVideo, 6000);
					done = true;
				}
			}
			function stopVideo() {
				player.stopVideo();
			}
		}
	},
});

Comments

[m.ts10806]

実際のコードをご提示ください。

[17dez]

反応ありがとうございます。

Answer 1

解決策と言うよりデバッグしてみた経過みたいな感じの回答です。
もう少し情報確認できれば回答に追記するかもしれません。

通常は[.]つなぎでとれるはずなんですけど、current.$iframe時点でundefinedになりますね。
確かに辿れば提示のようにIDは出てきてはいます。
current.$slideはとれるのですけども。current.$iframeはundefined。

もしかしたら、beforeLoad時点では参照不可なオブジェクト（それかまだ値未設定）なのかもしれませんね。
参照可能となる別のタイミングがあるのかもしれません。

追記：
ちなみにbeforeLoadではなくafterLoadでは$iframeの内容も出力されたので、辿れそうに思います。
下記、参考まで。

        afterLoad : function(instance, current) {
            console.log(current.$ifame);
        },

Comments

[17dez]

検証ありがとうございます。
そうなんですよ。。
beforeShowでもundefinedになるし、その他はターゲットがない状態だと発火すらしません。
でもcurrentにはきちんと入っているので、currentから直接取得できればいいんですが、方法が分からない次第です。

[m.ts10806]

もし質問時点でご存知の内容があれば「ここまでは確認した」「ここは調べた」という項目を記載しておいてもらえたらと。二度手間三度手間になります。
一応、別の方向から確認した状況を追記しました。
見た感じでは「before**のイベントでは取得不可能」かもしれませんね。

[17dez]

iframeもsrcを指定しないと、current.$iframeでは出力されなかったみたいです。
検証ありがとうございました。

[m.ts10806]

なるほど。確かにsrcないと表示する先がないですから、オブジェクト生成されないということかもしれませんね。